如何使用jquery从元素中获取属性的id?

时间:2012-02-22 10:30:47

标签: javascript jquery html

我写了这个迷你jquery片段,但我想得到li元素的id,所以我可以将这些数据发布到ajax调用这是我的脚本

 $('#list li a').on('click', function(e) {

        var id = ? //need to get li id
        e.preventDefault();

        $.ajax({
        type: "POST",
        url: "unfollow.php",
        data: id,
        success: function(){
            $(this).parent().hide();
        $('.updateNumber').html(function(){
            return parseInt($(this).text(),10)+1;
          });
        }
         });
       });
    });

这是一个示例html列表:

<ul id="list">
    <li id="list_1" class="list"><a href="">hide</a></li>
</ul>

谢谢:)

6 个答案:

答案 0 :(得分:3)

 $('#list li a').on('click', function(e) {
    var id = $(this).parent("li").attr("id");
    e.preventDefault();

    $.ajax({
    type: "POST",
    url: "unfollow.php",
    data: id,
    success: function(){
        $(this).parent().hide();
    $('.updateNumber').html(function(){
        return parseInt($(this).text(),10)+1;
      });
    }
     });
   });
});

答案 1 :(得分:3)

你可以使用普通的javascript(不需要额外调用jQuery)

var id = this.parentNode.id 

在这里摆弄http://jsfiddle.net/rL29r/

编辑 - 获取数字

var id = this.parentNode.id.replace('list_', '')

http://jsfiddle.net/rL29r/2/

答案 2 :(得分:1)

由于您匹配的<a>元素是<li>元素的后代,并且您似乎想要祖先id元素的<li>,您可以使用closest()方法:

var id = $(this).closest("li").attr("id");

答案 3 :(得分:1)

id = this.parentNode.id;

这比jQuery等价物快至少8倍。不要将jQuery用于如此简单的事情。

答案 4 :(得分:0)

在jsFiddle.net上查看此demo。您需要将.parent()$(this)一起使用。

HTML

<ul id="list">
  <li id="list_1">
    <a href="#">Test Anchor One</a>
  </li>
  <li id="list_2">
    <a  href="#">Test Anchor Two</a>
  </li>
</ul>​

的JavaScript

$('#list li a').on('click', function(e) {
    var id = $(this).parent().attr("id").replace("list_", "");
   alert(id);
});​

这会将12设为id。 希望这会对你有所帮助。

答案 5 :(得分:0)

对于list_n使用

的数量
var id = this.parentNode.id;
var number = id.substring(5);