Як отримати href натиснутого посилання за допомогою jquery?


87

Хтось знає, як я можу отримати href натиснутого посилання за допомогою jquery? У мене є таке посилання:

    <a  href="ID=1" class="testClick">Test1.</a>
    <br />
    <a  href="ID=2" class="testClick">Test2.</a>
    <br />
    <a  href="ID=3" class="testClick">Test3.</a>

Я написав наступний код, щоб отримати значення href за посиланням, яке я натиснув. Але якимось чином це завжди повертає мені href 1-го посилання (ID = 1), хоча я натиснув Test2 або Test3. Хтось знає, що тут відбувається? і як я можу вирішити цю проблему?

    $(".testClick").click(function () {
        var value = $(".testClick").attr("href");
        alert(value );
    });

Відповіді:


176

це у вашій функції зворотного виклику відноситься до клацаного елемента.

   $(".addressClick").click(function () {
        var addressValue = $(this).attr("href");
        alert(addressValue );
    });

18
Або можна просто отримати до нього безпосередній доступ, замість створення об’єкта jQuery. var addressValue = this.href;
Кріс

1
FYI, якщо href є відносним, href="sibling_file.htm"тоді $ (this) .attr ("href") повертається, sibling_file.htmі this.href повертається https://example.com/folder/sibling_file.htm(саме цього я очікував і хотів.)
Redzarf


10
$(".testClick").click(function () {
         var value = $(this).attr("href");
         alert(value );     
}); 

Коли ви використовуєте $ (". ClassName"), ви отримуєте набір усіх елементів, що мають цей клас. Потім, коли ви викликаєте attr, він просто повертає значення першого елемента в колекції.


4

Припустимо, у нас є три прив'язувальні теги, наприклад,

<a  href="ID=1" class="testClick">Test1.</a>
<br />
<a  href="ID=2" class="testClick">Test2.</a>
<br />
<a  href="ID=3" class="testClick">Test3.</a>

тепер у сценарії

$(".testClick").click(function () {
        var anchorValue= $(this).attr("href");
        alert(anchorValue);
});

використовувати це ключове слово замість className (testClick)

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.