通过CSS Selector将参数传递给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。

而且我认为你应该使用idnotclass来实现这一点，正如前面提到的，如果你将数字存储在属性之类的东西中data-id，那么你可以通过 来获取它，这可能会更好$(this).data('id')。