Question

我需要捕获text between <a> and </a> tags并导致弹出消息。我尝试按如下方式执行此操作。但是，由于链接是动态生成的，因此我无法将ID提供给链接。所以我尝试给他们class并使用jquery来选择元素。

然后，我不确定如何使用jquery选择当前单击的元素。

假设生成的链接如下

<a href="#" class="mylinkclass"> first link </a> <br>
<a href="#" class="mylinkclass"> second link </a> <br>
<a href="#" class="mylinkclass"> third link </a> <br>
<a href="#" class="mylinkclass"> fourth link </a> <br>

在javascript中，我不确定如何使用jquery选择当前单击的元素。我知道$('.mylinkclass')将返回上述4个链接的数组。如何编写选择器代码？

$(document).ready(function(){
   $('.mylinkclass').click(function(){getLinkText();});
}

function getLinkText(){
    alert($(this).text());
    return false;
}

Answer 1

改变这个......

 $('.mylinkclass').click(function(){getLinkText();});

到此......

 $('.mylinkclass').click(getLinkText);

这样您就可以直接将函数指定为处理程序。这样，它的this值将是对所单击元素的引用。

如果在调用getLinkText之前还有其他工作要做，你可以通过传递this作为参数来传递元素......

 $('.mylinkclass').click(function(){
     // do other work
     getLinkText(this);
 });

function getLinkText(el){

    alert($(el).text());
    return false;
}

或者使用.call或.apply使函数中的this具有相同的值...

 $('.mylinkclass').click(function(){
    // do other work
    getLinkText.apply(this, arguments);
 });

function getLinkText(){

    alert($(this).text());
    return false;
}

Answer 2

当您从匿名函数

中调用它时，this引用会丢失

$('.mylinkclass').click(function(){
   alert($(this).text());
   return false;
});

或

$('.mylinkclass').click(getLinkText);

function getLinkText(){
//..

或

$('.mylinkclass').click(function () {
   getLinkText(this);
});

function getLinkText(that){
   alert($(that).text());
   return false;
}

Answer 3

您也可以写下来：

$('.mylinkclass').click(function(e)
  {
    e.preventDefault(); // we don't want to cause the page to refresh or jump to top
    alert($(this).text());
  });

Answer 4

您的问题是如何设置/调用getLinkText（）函数。

尝试以下方法：

$('.mylinkclass').click(getLinkText);

您需要将getLinkText本身作为点击处理程序传递，而不是调用getLinkText的匿名函数

Answer 5

您可以使用 text（）函数 $（“。mylinkclass”）获取文本链接.text（$（“。link”）。text（）

捕获链接中的文本（<a>) element on click</a>

5 个答案: