Question

您好我在这里尝试做的是我在HTML中生成一个链接列表作为锚标记：

<a href="/path/100" id="clickme">One link</a>
<a href="/path/101" id="clickme">Sec link</a>
<a href="/path/102" id="clickme">Third link</a>
<a href="/path/103" id="clickme">Fourth link</a>

当有人在任何链接上徘徊时，我想激活Ajax对特定网址的调用。所以我正在为这个id注册hover()这样的函数：

$('#clickme').hover(function(){
         $.ajax({
                beforeSend : function(jqXHR){
                    //Doin something
                },
                url: //should be the url from the anchor tag that fired this event(how to get it??),
                success: function(data) {
                    //Doin something
                },
                error: function(jqXHR){
                    //Doin something
                }
              });
        });

我的问题是如何将锚标记作为对象或其他东西传递，以便我可以检索我想要的任何内容href，链接的位置等。

对于单锚标签，它正在工作，但对于倍数不是..请帮助我。提前谢谢。

Answer 1

您应该使用类而不是对多个对象使用相同的id，并对每个对象使用this.href。不允许为多个html元素分配相同的id，尽管你可以这样做。

<a href="/path/100" id="clickme" class="someclass">One link</a>
<a href="/path/101" id="clickme" class="someclass">Sec link</a>
<a href="/path/102" id="clickme" class="someclass">Third link</a>
<a href="/path/103" id="clickme" class="someclass">Fourth link</a>


$('.someclass').hover(function(){
     $.ajax({
            beforeSend : function(jqXHR){
                //Doin something
            },
            url: //should be the url from the anchor tag that fired this event(how to get it??),
            success: function(data) {
                //Doin something
            },
            error: function(jqXHR){
                //Doin something
            }
          });
});

Answer 2

id应该始终是唯一的（这就是它被称为ID的原因）..使它成为类并使用类选择器

<强> HTML

<a href="/path/100" class="clickme">One link</a>
<a href="/path/101" class="clickme">Sec link</a>
<a href="/path/102" class="clickme">Third link</a>
<a href="/path/103" class="clickme">Fourth link</a>

<强> jquery的

$('.clickme').hover(function(){
     var $this=$(this);
     $.ajax({
            beforeSend : function(jqXHR){
                //Doin something
            },
            url: //should be the url from the anchor tag that fired this event(how to get it??),
            data:{'href':$this.attr('href')}, //this will send '/path/100' as href if u click first link 
            success: function(data) {
                //Doin something
            },
            error: function(jqXHR){
                //Doin something
            }
          });
    });

Answer 3

它不起作用，因为ID是唯一的，jQuery只会找到ID的第一个实例。

<a href="/path/100" class="clickme">One link</a>
<a href="/path/101" class="clickme">Sec link</a>
<a href="/path/102" class="clickme">Third link</a>
<a href="/path/103" class="clickme">Fourth link</a>

JS

$('.clickme').mouseenter(function(){
    var href = $(this).attr('href');
    $.ajax({
         url : href
    });
});

Answer 4

如果您的悬停事件处理程序获取href属性，您可以在里面使用$(this)。关于使用class而不是id，其他答案是正确的。下面的示例设置为使用“clickme”类而不是id。

$('.clickme').hover(function(){
     var $this = $(this);
     var theUrl = $this.attr('href');

     $.ajax({
            beforeSend : function(jqXHR){
                //Doin something
            },
            url: theUrl
            success: function(data) {
                //Doin something
            },
            error: function(jqXHR){
                //Doin something
            }
          });
    });

如何将动态生成的锚标签的URL传递给jQuery hover（）函数？

4 个答案: