Question

我正在尝试在iframe按钮点击的基础上执行操作。但我无法做到。

HTML： -

<div class="content">
    Here my content displaying
    <script type="text/javascript">
    $(document).ready(function(){
      $('#ifrme_btn').click(function(){
        console.log('button clicked');
        $('#message_div', window.parent.document).hide();
      });

    });
    </script>
      <div id="message_div">
            After click on iframe button i want hide this div
    </div>

    <iframe id="Iframe">
    <html lang="en-US" dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
    <title>Any Title</title>
    </head>
    <body id="ifrme-content">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor 
        incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud 
           <input type="button" id="ifrme_btn" name="Check Status" value="Clicked Iframe Button" />
    </body>
    </html>
    </iframe>
</div>

点击ifrme_btn我要隐藏message_div

Answer 1

如果您正在与生成的元素进行交互，请使用.live（“click”）。

http://api.jquery.com/live/

例如：

$("#ifrme_btn").live("click", function(){
    $("#message_div").hide();   
    }
});

Answer 2

功能：

$(document).ready(function(){
      $('#ifrme_btn').click(function(){
        console.log('button clicked');
        $('#message_div', window.parent.document).hide();
      });

    });

应该在iframe内，而不是在主文档中。

Answer 3

你可以这样做

<强> HTML

  <iframe name="Iframe" id="Frame"></iframe>

<强>的jQuery

$('[name=Iframe]').contents().find('#ifrme_btn').click(function() {
  $('#message_div').hide();
});

在jquery中单击来自父级的iframe div的操作

3 个答案: