javascript - 通过 CSS 选择器将参数传递给 javascript 函数

Question

所以，简而言之，我有一套 .li

<ul>
  <li class="lmit_1"><a href="#" >Home</a></li>
  <li class="lmit_2"><a href="#">About us</a></li>
  <li class="lmit_3"><a href="#">Who we are</a></li>
  <li class="lmit_4"><a href="#">Whats new</a></li>
  <li class="lmit_5"><a href="#">Contact Us</a></li>    
</ul>

和我的 javascript (jQuery)

<script>
  $(".lmit_" + id).click(function () {
    alert(id);
  });
</script>

我想做的是接收 css 类末尾的任何数字作为参数(例如 .lmit_3 将允许 id = 3)，因此 alert(id) 应该导致弹出数字 3 ？我是编程和 javascript 的新手，所以如果答案让我眼前一亮，我深表歉意...

Answer 1

演示:http://jsfiddle.net/sFwZj/1/

$('li').click(function () {
  alert($(this).attr('class').split('_')[1]);
});

在您的代码中，您使用了名为 id 的未声明变量，因此它应该抛出错误 ReferenceError: id is not defined，当您尝试 ".lmit_"+编号。

而且我认为你应该为此使用 id 而不是 class ，同样如前所述，如果你将数字存储在类似 data-id属性，那么你可以通过$(this).data('id')获取。