Question

<ul class="myul">
    <li value="2" data-liname="2">2</li>
    <li value="3" data-liname="3">3</li>
    <li value="3+" data-liname="3+">3+</li>
</ul>

使用jQuery：

$(".myul li").on("click", function(){
    var myval = $(this).data("liname");
    var myval1 = $(this).val();
});

当我选择3+时，我可以获得myval的值，但myval1只显示3而不是3+。 myval1适用于其他值。只有当一个nimber有+符号时，它才会选择忽略它。

我做错了什么？

Answer 1

使用li个值属性，它们为有序列表中的排序指定一个数字值。只会从值中获取数字部分，从而使3+成为3。这是一个片段，展示了会发生什么：

<ol class="myul">
    <li value="2" data-liname="2">2nd</li>
    <li data-liname="2">3rd</li>
    <li data-liname="2">4th</li>
    <li data-liname="2">5th</li>
  
    <li value="100+@#$**$&">100th, notice string part is removed</li>
    <li>101th</li>

    <li value="105+">105th, notice + is removed</li>
</ol>

请注意，这是ol或有序列表。 value属性的作用是设置排序次数。在上面的代码段中，您可以看到从value删除了非数字部分，只留下了数字部分进行排序。

这一切意味着当您致电$(this).val()时，它会返回value属性。但由于value属性在第一个非数字字符之后删除所有部分，因为它们不用于订购有序列表，它会给你3而不是3 +。

Answer 2

尝试以下代码。这有效。

$(".myul li").on("click", function(){
  var myval = $(this).data("liname");
  var myval1 =$(this).attr('value');
});

Javascript没有显示列表项的值

2 个答案: