Question

这个让我疯了。我有一个div，它在页面加载时通过Ajax加载它的内容。 div的内容是几个超链接。我正在尝试使用$(this).attr('href')获取所点击链接的HREF值。但是，这总是返回“未定义”。我猜，因为超链接是通过Ajax动态加载的，所以jQuery无法返回HREF值。我检查了页面源并确认所有超链接都带有有效的HREF链接。

如何检索通过Ajax动态加载的超链接的HREF值？

Answer 1

使用jQuery绑定点击功能

$('#container a').on('click', function(event) {
     alert($(this).attr('href'));
     return false;
});

http://api.jquery.com/on/

从jQuery 1.7开始，不推荐使用.live（）方法。

Answer 2

此代码是否在文档就绪块中？
您必须记住的是，必须在完全加载后添加到DOM的链接上使用.on("click")。因为当你在文档就绪块中使用.click()时它无法工作，因为此时你的元素甚至都没有被加载，因为加载元素的ajax执行得更慢并且可能在DOM准备好后执行。所以，如果你这样做

$('a').on("click",function(){
   alert($(this).attr('href'));
});

一切都应该适合你。

请查看文档，以便更容易理解：

http://api.jquery.com/on/

Answer 3

John上面的答案有效但你犯的错误就是不遵循它背后的逻辑。

我希望我所做的例子对你最终理解如何调用一个函数是有意义的。

第一个例子说：

$('#container a').on('click', function(event) {
     alert($(this).attr('href'));
     return false;
});

看看：function(event) 如果你想使用preventDefault();

您应该使用event.preventDefault();

因为您调用了事件函数

您可以执行以下操作：

1）

$('#container a').on('click', function() {
     alert($(this).attr('href'));
     return false;
});

2）

$('#container a').on('click', function(event) {
         event.preventDefault();
         alert($(this).attr('href'));

    });

3）

$('#container a').on('click', function(IamWhatYouWantMeToBe) {
         IamWhatYouWantMeToBe.preventDefault();
         alert($(this).attr('href'));

    });

4）

$('#container a').on('click', function() {
         preventDefault();
         alert($(this).attr('href'));
    });

5）

$('#container a').on('click', function(e) {
             e.preventDefault();
             alert($(this).attr('href'));
        });

您应该在函数内的任何其他内容之前使用preventDefault();，

或者您可以根据上述示例在功能结束时仅使用return false;。

获取jQuery中通过Ajax动态加载的单击链接的HREF值

3 个答案: