如何動(dòng)態(tài)顯示div ? 更改div內(nèi)容 - .NET - 提供最全面實(shí)用的Java面試題,...

yfm10 2010-01-14

展開全文

開始寫.net 很多地方不明白，請(qǐng)教了

現(xiàn)在有一個(gè)repearter，其中一列本來是一個(gè)鏈接，url后面跟了個(gè)id的參數(shù)，點(diǎn)擊后出現(xiàn)一個(gè)新窗口顯示點(diǎn)東西,比較容易

現(xiàn)在需要彈出一個(gè)div來顯示內(nèi)容不能刷新頁面，我就沒轍了，不知道如何解決，發(fā)現(xiàn)有的說div里嵌套iframe，有的說xml。。。

反正都不會(huì)~請(qǐng)教了

http://topic.csdn.net/u/20080226/14/b2b42796-910d-42a3-81e5-a28bd6103ee4.html
參照這個(gè)改一下吧

<a href="#" onclick="javascript:ShowDiv(3,event);">click </a>

JScript code

  var gFrame = null;
function ShowDiv(id,evt)
{
if(gFrame == null)
{
gFrame = document.createElement("IFRAME");
document.body.appendChild(gFrame);
gFrame.style.position = "absolute";
gFrame.style.zIndex = 1000;
}
gFrame.src = "b.aspx?id="+id
gFrame.style.left = evt.x;
gFrame.style.top = evt.y
gFrame.style.display = "";
}

多謝多謝，頂頂~

忘了說一點(diǎn)，這個(gè)彈出來的東東頂部還要有一個(gè)xx的圖片，點(diǎn)了后將這個(gè)div撤銷掉不顯示
如果是用dom生成iframe的話，是不是這個(gè)地方不太好弄？思路一片混亂！

傳id基本明白了，是不是把綁定的id那列作為javascript函數(shù)的參數(shù)傳出去就行了？

艾，以前從來不寫前臺(tái)的，現(xiàn)在痛苦死

div_msg.style.visibility="visible";
div_msg.style.visibility="hidden";

<div id="detail">
<div id="toolbar" style="cursor: pointer;" onmousedown="down(event)" onmouseup="up();"
onmousemove="move(event)">
<span id="wintitle" style="float: left;"> </span> <span style="float: right; padding-top: 5px;
padding-right: 5px;"> <a href="javascript:void(0)">
<img alt="點(diǎn)擊關(guān)閉" src="images/x.gif" width="16" height="15" id="img_colse" border="0"
onclick="MM_showHideLayers('detail',false)" /> </a> </span> <span style="clear: both;">
</span>
</div>
<div id="content">
<iframe scrolling="auto" id="ifContent" name="ifContent" height="320px" width="100%"
style="border-style: outset; border-width: 0px;"> </iframe>
</div>
</div>

<script type="text/javascript">
var flag=false;
var x_start=0;
var y_start=0;
function move(e)
{
if(flag)
{
var src = e.srcElement || e.target;
if(src.id=="img_colse")
{
flag=false;
return false;
}
var obj=document.getElementById("detail");
if(e.offsetX)
{
obj.style.left=parseInt(e.clientX-x_start-2) + "px";
obj.style.top=parseInt(e.clientY-y_start-2) + "px";
}
else
{
// obj.style.left=parseInt(e.clientX- top.leftFrame.document.width -x_start-2) + "px";
// obj.style.top=parseInt(e.clientY - top.topFrame.document.height -y_start-2) + "px";
}
// var spanObj=document.getElementById("mInfo");
// spanObj.innerHTML="e.clientX:" + e.clientX;
// spanObj.innerHTML+="e.offsetX:" + e.offsetX;
// spanObj.innerHTML+="e.clientX-e.offsetX:" + (e.clientX-e.offsetX);
}
}
function down(e)
{
flag=true;
if(e.offsetX)
{
x_start=e.offsetX;
y_start=e.offsetY;
}
else
{
x_start=e.clientX - top.leftFrame.document.width;
y_start=e.clientY - top.topFrame.document.height;
}
var obj=document.getElementById("toolbar");
obj.style.cursor = "move";

}
function up()
{
flag = false;
x_start=0;
y_start=0;
var obj=document.getElementById("toolbar");
obj.style.cursor = "pointer";
}
function MM_showHideLayers(id,v,param,e) { //v6.0
var obj = document.getElementById(id);
if(e)
{
obj.style.left = parseInt(document.documentElement.clientWidth/2-150) + "px";
obj.style.top = parseInt(document.documentElement.clientHeight/2-150 ) + "px";
}
if(obj)
{
if(v)
{
obj.style.display="block";
document.getElementById("wintitle").innerHTML="業(yè)務(wù)詳情";
if(document.getElementById("ifContent")!=null)
document.getElementById("ifContent").src="ShowDetail.aspx?id="+param;
}
else
{
ifContent.document.write("請(qǐng)稍候，數(shù)據(jù)正在載入中。。。");
ifContent.document.close();
//document.frames["ifContent"].document.write("請(qǐng)稍候，數(shù)據(jù)正在載入中。。。");
obj.style.display="none";
document.getElementById("ifContent").setAttribute("height","220");

}
}
}
</script>

調(diào)用showHideLayers函數(shù)來顯示
里面關(guān)于firefox下，浮動(dòng)的代碼還沒寫好。在IE下沒問題

div里嵌套iframe,這個(gè)方法可以。不會(huì)刷新頁面
你去下個(gè)jquery庫，在下個(gè)thickbox，即可實(shí)現(xiàn)。

不能用別的庫啊，寫了10年的代碼沒文檔，我現(xiàn)在都不知道如何入手

可以在div中用iframe來顯示新窗口頁面,再控制iframe是否顯示頁面.代碼如下:

主頁面

HTML code


<html xmlns="http://www./1999/xhtml" >
<head runat="server">
<title>未命名頁面</title>
<script type="text/javascript" language="javascript">
function ShowPage()
{
document.getElementById('iframe1').style.display = 'block';
window.event.returnValue=false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:LinkButton ID="LinkButton1" OnClientClick="ShowPage()" runat="server">ShowPage</asp:LinkButton>
<div id="div1">
<iframe id="iframe1" src="popPage.aspx" style="height:600px;width:750px;display:none;"></iframe>
</div>
</form>
</body>
</html>

新窗口頁面

HTML code


<html xmlns="http://www./1999/xhtml" >
<head runat="server">
<title>未命名頁面</title>
<script type="text/javascript" language="javascript">
function ClosePage()
{
window.parent.document.getElementById('iframe1').style.display="none";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<img src="Image/P2P_1.jpg" onclick="ClosePage()" style="cursor: hand" />
</div>
</form>
</body>
</html>

5樓的兄弟，這個(gè)不用設(shè)z-index嗎？
如果不顯示的時(shí)候應(yīng)該沒問題，但是如果現(xiàn)實(shí)的時(shí)候，不設(shè)置z-index到底這個(gè)div和其他元素誰會(huì)顯示出來
我是需要這個(gè)div蓋過其他東西的

看看...

學(xué)習(xí)

引用 9 樓 warcraftpao 的回復(fù):
5樓的兄弟，這個(gè)不用設(shè)z-index嗎？
如果不顯示的時(shí)候應(yīng)該沒問題，但是如果現(xiàn)實(shí)的時(shí)候，不設(shè)置z-index到底這個(gè)div和其他元素誰會(huì)顯示出來
我是需要這個(gè)div蓋過其他東西的

如果后面的層不是順序輸出，而是設(shè)置了z-index的話，那你就給它隨便設(shè)置個(gè)比較大的就可了。

如果后面的層是順序輸出，沒有設(shè)置z-index的話，就這樣就OK。這是我從我項(xiàng)目中直接復(fù)制出來的，一直沒問題的。

document.getElementById('id').innerHTML="this is test";

你首先把div顯示的腳本寫出來，然后把要?jiǎng)討B(tài)顯示的值當(dāng)作參數(shù)，寫成一個(gè)腳本function

在綁定repeater的時(shí)候，在row綁定的時(shí)候，給linkbutton.Attributes.Add("onclick", "javascript:方法;");

這樣就可以解決你的動(dòng)態(tài)div的問題

div 里放 iframe

學(xué)習(xí)

補(bǔ)遺:
clientX 設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于窗口客戶區(qū)域的 x 坐標(biāo)，其中客戶區(qū)域不包括窗口自身的控件和滾動(dòng)條。
clientY 設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于窗口客戶區(qū)域的 y 坐標(biāo)，其中客戶區(qū)域不包括窗口自身的控件和滾動(dòng)條。

offsetX 設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于觸發(fā)事件的對(duì)象的 x 坐標(biāo)。
offsetY 設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于觸發(fā)事件的對(duì)象的 y 坐標(biāo)。

screenX 設(shè)置或獲取獲取鼠標(biāo)指針位置相對(duì)于用戶屏幕的 x 坐標(biāo)。
screenY 設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于用戶屏幕的 y 坐標(biāo)。

x 設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于父文檔的 x 像素坐標(biāo)。
y 設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于父文檔的 y 像素坐標(biāo)。

你怎么改的告訴我啊

本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間，所有內(nèi)容均由用戶發(fā)布，不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊一鍵舉報(bào)。

轉(zhuǎn)藏 分享

QQ空間 QQ好友新浪微博微信

獻(xiàn)花（0） +1

來自： yfm10 > 《JavaScript》

舉報(bào)/認(rèn)領(lǐng)