将控制绑定到iframe中的内容

时间:2013-10-15 15:18:50

标签: jquery iframe

基本上,我有2个php页面,分别是a.php和b.php。我想要实现的是将jquery函数绑定到b.php中的内容。

jquery函数将用于触发a.php中的弹出窗口。但是,我无法让它奏效。有谁知道我做了什么错误?

a.php只会

<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <title></title>
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
      <script>
         $(function () {
         var abc = function(){
         alert("");
         }
         $("iframe").contents().find("a.toggle").click(abc);
         });
      </script>
      <meta http-equiv="cache-control" content="no-cache">
      <meta http-equiv="pragma" content="no-cache">
   </head>
   <body>
      <form method="post" action="">
         <div class="container" id="">
            <div class="resize main" id="" style="height: 600px;">
               <iframe id="" frameborder="0" scrolling="no" src="b.php" style="width: 1022px; border: none; height: 600px;">
               </iframe>
            </div>
         </div>
      </form>
   </body>
</html>

b.php

<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <title></title>
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta http-equiv="cache-control" content="no-cache">
      <meta http-equiv="pragma" content="no-cache">
   </head>
   <body>
      <form method="post" action="b.php">
         <div class="titlewrap">
            <div id="" class="pagetitle">
               <a class="toggle" href="#"><span class="icon slider-close">aa</span></a>
            </div>
         </div>
      </form>
   </body>
</html>

1 个答案:

答案 0 :(得分:0)

我相信这是因为你的javascript函数是在iframe加载之前执行的。如果你改变了

   $("iframe").contents().find("a.toggle").click(abc);

 setTimeout( function(){ $("iframe").contents().find("a.toggle").click(abc); }, 2000);

那么你的代码就可以了。

因此,为了解决您的问题,我建议将绑定函数移动到b.php并在触发document.ready事件时调用它。

<强> b.php

<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <title></title>
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta http-equiv="cache-control" content="no-cache">
      <meta http-equiv="pragma" content="no-cache">
      <script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
      <script>
       $(document).ready(
        function()
        {
           var abc = function(){
           alert("");
           }
           $('.toggle').on('click', abc);
        }
       );
      </script>
   </head>
   <body>
      <form method="post" action="b.php">
         <div class="titlewrap">
            <div id="" class="pagetitle">
               <a class="toggle" href="#"><span class="icon slider-close">aa</span></a>
            </div>
         </div>
      </form>
   </body>
</html>
相关问题