Question

我的网站上有x个链接，如下所示：

<a href="www.link1.com" id="UseLink" value="1">www.link1.com</a>
<a href="www.link2.com" id="UseLink" value="2">www.link2.com</a>
<a href="www.link3.com" id="UseLink" value="3">www.link3.com</a>

在底部，我有一个小Javascript应该对点击链接的值做一些事情。

    $('#UseLink').click(function(e){ 

    var url = "www.domain.com/uselink"; 

    $.ajax({
       type: "POST",
       url: url,
       data: {'linkid' : this.getAttribute('value')},
       success: function(data)
       {
            console.log("Use link result: " + data);
            if (data === 'success') {
            }
            if (data === 'error') {
            }
       }
    });

    e.preventDefault();

});

无论我点击什么链接，它总是使用link1的id。任何人都知道为什么这不起作用？

Answer 1

Id必须是独一无二的。以下是一些变化：

<a href="www.link1.com" id="1" class="UseLink" value="1">www.link1.com</a>
<a href="www.link2.com" id="2" class="UseLink" value="2">www.link2.com</a>
<a href="www.link3.com" id="3" class="UseLink" value="3">www.link3.com</a>

JS：

$('.UseLink').click(function(){
    var id = $(this).attr('id');
    // id contains the id of clicked anchor
});

Answer 2

ID必须是唯一的，您已为所有标签分配了相同的ID。这就是jquery脚本击中第一个元素的原因。

Answer 3

使用纯JavaScript可能有很多方法可以做到这一点，但由于它有PHP标记，我会给你一个涉及php的答案。

<?php
$id = isset($_GET['id']) ? $_GET['id'] : false;
?>
<script type="text/javascript">
var id = '<?= false !== $id ? $id : ""; ?>';
$('#UseLink').click(function(e){ 

  var url = "www.domain.com/uselink"; 

  $.ajax({
     type: "POST",
     url: url,
     data: {'linkid' : id},
     success: function(data)
     {
          console.log("Use link result: " + data);
          if (data === 'success') {
          }
          if (data === 'error') {
          }
     }
  });

  e.preventDefault();

});
</script>

触发此代码的链接：

<a href="<?= $_SERVER['PHP_SELF']; ?>?id=1">Link 1</a>
<a href="<?= $_SERVER['PHP_SELF']; ?>?id=2">Link 1</a>
<a href="<?= $_SERVER['PHP_SELF']; ?>?id=3">Link 1</a>

Answer 4

var value = $（this）.val（）; 在ajax调用上面使用它并传递值数据

Answer 5

首先，你需要知道id和class之间的区别。 ID必须在整个页面中都是唯一的。您可以访问此链接https://css-tricks.com/the-difference-between-id-and-class/以了解ID和课程。

根据你的问题，如果你将id改为class，我认为它会很好。

感谢。

从链接获取id并在javascript中使用它

5 个答案: