如何使用jquery获取html列表项的id?

时间:2011-11-18 18:53:55

标签: jquery html html-lists

我想使用jquery获取<li>的id。我能够使用alert($(this).text())获取文字,但当我尝试alert($(this).id())时,它会显示undefined

<html>
<head>
<style type="text/css">
 ul {
  list-style-type: none;
 }
</style>
<script type="text/javascript" src="jquery1.6.4min.js"></script>
 <script type="text/javascript" > 
  $(document).ready(function() {
   $('#list li').click(function() {
    alert($(this).id());
    alert($(this).text());
   });
  });
</script>
</head>
<body>
 <ul id="list">
  <li id="l1">Value 1</li>
  <li id="l2">Value 2</li>
  <li id="l3">Value 3</li>
  <li id="l4">Value 4</li>
  <li id="l5">Value 5</li>
  <li id="l6">Value 6</li>
  <li id="l7">Value 7</li>
  <li id="l8">Value 8</li>
  <li id="l9">Value 9</li>
  <li id="l10">Value 10</li>
  <li id="l11">Value 11</li>
  <li id="l12">Value 12</li>
 </ul>
</body>
</html>

Plase帮我解决这个问题。提前谢谢。

5 个答案:

答案 0 :(得分:10)

您应该使用attr()函数从元素中获取属性:

alert($(this).attr('id'));

jQuery对象没有名为id()的方法,这就是为什么你得到undefined的结果。

答案 1 :(得分:3)

实际上是$(this).attr('id'),而不是$(this).id()

答案 2 :(得分:2)

id是一个属性。你需要

alert($(this).attr('id'))

答案 3 :(得分:1)

 $(document).ready(function() {
   $('#list li').click(function() {
    alert($(this).attr("id"));
    alert($(this).text());
   });
  });

检查jsfiddle here

答案 4 :(得分:0)

您可以使用jQuery 1.6 +然后使用此代码。

var id = $(this).prop('id');