0

好的，所以我有一个收件箱样式的布局，每条消息都有多条带有动态内容的消息，我想单击一个链接（需要操作），一旦单击它将打开一个包含 iFrame 的下拉 div。这是我正在使用的 Javascript：

<script language="javascript"> 

function toggle() {
    var ele = document.getElementById("toggleText");
    var text = document.getElementById("displayText");
    if(ele.style.display == "block") {
            ele.style.display = "none";
        text.innerHTML = "<iframe src=\"http://m.quotesin.com/an.html\" width=\"100px\" frameborder=\"0\" height=\"20px\" allowtransparency=\"yes\" scrolling=\"no\"></iframe>";
    }


else {
        ele.style.display = "block";
        text.innerHTML = "<iframe src=\"http://m.quotesin.com/an.html\" width=\"100px\" frameborder=\"0\" height=\"20px\" allowtransparency=\"yes\" scrolling=\"no\"></iframe>";
    }
} 

</script>

并显示：

<a id="displayText" href="javascript:toggle();"><div style="posistion:relative;"><img src="images/iframe.png" style="position:absolute;"><iframe src="http://m.quotesin.com/an.html" width="100px" frameborder="0" height="20px" allowtransparency="yes" scrolling="no"></iframe></div></a>



设计视图的图像在这里...之前： 在此处输入图像描述 之后： 在此处输入图像描述 但是当收件箱中有多个这些时，第二个不会打开，是否有一个简单的 CSS 显示和隐藏父和子不会共享相同的属性我可以使用，或者任何关于去哪里的建议。

谢谢

4

1 回答 1

1

就动态 HTML 而言，不使用 Javascript 或 JQuery 就无法处理它。其次，您编写的 JavascriptgetElementById仅允许单个元素（指定了相同的 id。）选择。

由于您希望使用相同的代码来处理多个收件箱，因此您需要容器和子选择器来帮助您提供相同的效果。
您需要使用允许多项选择的 id 以外的选择器。
如果我弄错了，请告诉我。如果您可以将代码放在 JS fiddel 中会更好。

享受编码；）

于 2013-02-08T12:48:41.887 回答