Question

我创建了一个网页：

当用户点击按钮时，iframe会打开
我是通过在css文件中创建iframe display:none来实现的。
单击该按钮时，display属性变为inline（通过jQuery）

但是，当显示iframe时，还有close按钮。点击后，iframe display再次变为none。但是，问题是它无法正常工作。简而言之，关闭按钮中的display:none无效。

我的代码如下：

$(document).ready(function() { 
$("#a_addupdate").click(function(){
    $("#iframe_add_update").css(
        "display" , "inline"    
    );
 });
}); //This will show the iframe


$(document).ready(function() {
    $("#close_frame").click(function(){
        $("#iframe_add_update").css(
        "display" , "none"
        );

    });
} //This will hide the frame

修改：我还使用z-index:2作为iframe

Answer 1

如果关闭按钮位于iframe上，则应使用：

// code in your iframe
$(document).ready(function() {
    $("#close_frame").click(function(){
        $("#iframe_add_update", window.parent.document).css(
        "display" , "none"
        );

    });
}

注意window.parent.document位。这将使您的代码在父页面上搜索#iframe_add_update元素。

如果您的jQuery中也有iframe并且他们都在同一个域中，这将有效。

Answer 2

您可以更新为：

$(document).ready(function() {
  $("#iframe_add_update").contents().find("#close_frame").click(function() {
    $("#iframe_add_update").css("display", "none");
  });
}); //This will hide the frame

$("#iframe_add_update").contents()可让您找到iframe内的内容。

jQuery - display：none not working

2 个答案: