jQuery属性选择器在$中不工作.ajax调用(IE6, IE7)



我试图在AJAX调用后选择我的内容中的一些链接,但它似乎在IE6和IE7中不起作用(还没有测试过8或9)。点击链接时应该被覆盖,并且应该触发警报。但是,IE仍然尝试访问该地址。它在Chrome和Firefox中运行良好。

这是主HTML文档

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Cavern Sounds - Music production services</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<body>
<a href="someplace.html">someplace 1</a>
<div id="content"></div>
<script type="text/javascript">
$.ajax({
  url: "content.html",
  success: 
    function(html){
      $("#content").html(html);
      $('a[href="someplace.html"]').click(function(e){
        e.preventDefault();
        alert("hello world");});
    }
});
</script>
</body>
</html>

这里是"content.html",是AJAX调用

所检索的代码片段
<a href="someplace.html">someplace 2</a>
一个值得注意的有趣的事情是IE仍然覆盖第一个链接(没有被AJAX调用检索的链接)。它只是AJAX调用检索的内容中的链接,没有被覆盖。

欢迎提出任何建议。谢谢!

请尝试使用live来绑定事件

$(function(){
$('a[href*="someplace.html"]').live('click', function(e){
        e.preventDefault();
        alert("hello world");
});
$.ajax({
  url: "content.html",
  success: 
    function(html){
      $("#content").html(html);
   }
});
});

试试这个代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Cavern Sounds - Music production services</title>
<script type="text/javascript" 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<body>
</body>
<script type="text/javascript">
$.ajax({
  url: "content.html",
  success: 
    function(html){
      $("body").html(html);
      $('a[href*="someplace.html"]').live("click",(function(e){
        e.preventDefault();
        alert("hello world");}));
alert($('a[href*="someplace.html"]').size());
    }
});
</script>
jquery属性选择器和IE6-7错误

尝试使用。live()代替。click(),或者使用。delegate()更好。

您尝试绑定的链接是稍后引入的,在.click()绑定之前可能不可用。

这里是这个的JSfiddle,但现在看起来可能是一个选择器问题…JSFiddle

最新更新