包含html中的类无法访问父文件html中的函数

时间:2013-12-02 08:11:34

标签: javascript jquery html dom

我有一个带有以下内容的mainfile.html

<html> 
  <head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script> 
    $(function(){
      $("#includedContent").load("d.html"); 

      $(".alertclass").click(function(){
         alert('some c load action');
      });

    });
    </script> 
  </head> 

  <body> 
    <a class="alertclass" href="javascript:void(0);"> parent clicks heret </a>
    <br/>
     <div id="includedContent" ></div>

  </body> 
</html>

和我的“d.html”文件有内容

<div> <br/>
<a href="javascript:void(0);" class="alertclass">the child clicks here</a>
</div>

但是当我点击子页面中包含的内容中的链接时,类“alertclass”似乎不起作用。有没有办法让它适用于所包含的子页面?

P.S。 - 我试图使用“live”但是,它会抛出错误

  

“Uncaught TypeError:Object [object Object]没有方法'live'”

除了“直播”,我正在寻找解决方案。谢谢!!

1 个答案:

答案 0 :(得分:3)

live抛出了no method错误,因为它已从版本1.9中的jQuery中删除。通过将on与委托选择器一起使用来取代它。

您的问题是因为您在内容加载完成之前尝试将事件附加到.alertClass。尝试将事件挂钩放在load

的回调中
$("#includedContent").load("d.html", function() {
    $(".alertclass").click(function(){
        alert('some c load action');
    });
}); 

或者如我所提到的,您可以将on与委托选择器一起使用:

$("#includedContent").load("d.html");
$(document).on('click', ".alertclass", function(){
    alert('some c load action');
});