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。

此外，我认为您应该使用id而不是class，如前所述，如果您将数字存储在data-id属性中，那么可能会更好可以通过$(this).data('id')获得。

Answer 2

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

应该这样做

但为什么不呢

    <ul>
     <li class="lmit" id="lmit_1"><a href="#" >Home</a></li>
     <li class="lmit" id="lmit_2><a href="#">About us</a></li>

与

$(".lmit").click(function () {
  alert(this.id.split('_')[1]);
})

Answer 3

最好存储要在数据属性中使用的任何数据。这样，您就不会过多地依赖类和ID（以及字符串处理），也不会在格式和功能之间进行分离。

您的HTML将如下所示：

 <ul>
<li class="lmit" data-myattr="1"><a href="#" >Home</a></li>
<li class="lmit" data-myattr="2"><a href="#">About us</a></li>
</ul>

请注意，data-myattr可以被称为带有“data-”前缀的任何东西。

访问您的数据

       $(".lmit").click(function(){
//you can access it as an attribute
        alert($(this).attr("data-myattr"));
//or you can access it as data
           alert($(this).data("myattr"));
        })

或更无类别的解决方案使用事件委托

$("ul").delegate("li", "click", function() {
 alert($(this).data("myattr"));
});

所以你不需要在你的html中使用lmit类

 <ul>
<li data-myattr="1"><a href="#" >Home</a></li>
<li data-myattr="2"><a href="#">About us</a></li>
</ul>

Answer 4

试试这个

$('ul li').on('click', function(){
    alert($(this).prop('class').split('_')[1]);
});

Answer 5

以上答案都是正确的。如果您想获取<ul>中的商品编号，则可以选择其他商品。

$('li').click(function() {
    alert($(this).index()+1);
});

好处是您不必生成类名（如果它们全部用于）

Answer 6

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

如果您使用$（'li'），如果您点击任何li，它没有“limit_”类也会被解雇。

通过CSS Selector将参数传递给javascript函数

6 个答案: