jquery 计算某个类中data-attr包含number的所有元素

3phpmpom  于 2022-12-26  发布在  jQuery
关注(0)|答案(1)|浏览(177)

尝试获取类为“active“且其输入属性为“data-price“的每个元素的计数,该属性仅包含["&quot]之间的数字/价格。
因此,如果tot元素计数〉0,则执行以下操作...
超文本标记语言

<ul class="elem-ul">
    <li class="elem-li">
        <label class="elem-label active">    
            <input class="elem-input" data-price="[&quot;100&quot;]" type="checkbox">
       </label>         
   </li>
    <li class="elem-li">
        <label class="elem-label active">    
            <input class="elem-input" data-price="[&quot;400&quot;]" type="checkbox">
       </label>         
   </li>
    <li class="elem-li">
        <label class="elem-label active">    
            <input class="elem-input" data-price="[&quot;&quot;]" type="checkbox">
       </label>         
   </li>
    <li class="elem-li">
        <label class="elem-label">    
            <input class="elem-input" data-price="[&quot;&quot;]" type="checkbox">
       </label>         
   </li>
</ul>

jQuery我不知道如何从输入属性中获取数字

$('.elem-ul .elem-label.active').each(function(){
  var elemCt = $('input.elem-input', this).attr('data-price').length;
  if(elemCt > 0){
    //do something
  }
});
6tqwzwtp

6tqwzwtp1#

可以使用.data()方法而不是.attr()方法来检查引号中的数字是否大于0。使用.data()将提供一个数组作为返回值,因此可以将索引0作为目标,从该数组中获取字符串数字。然后可以使用.length获取该数字的长度。
参见以下工作示例:

$('.elem-ul .elem-label.active').each(function(){
  var elem =  $('input.elem-input', this).data('price')[0]
  var elemCt = elem.length;
  if(elemCt > 0){
    //do something
    console.log("The elements price is: " +elem);
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="elem-ul">
    <li class="elem-li">
        <label class="elem-label active">    
            <input class="elem-input" data-price="[&quot;100&quot;]" type="checkbox">
       </label>         
   </li>
    <li class="elem-li">
        <label class="elem-label active">    
            <input class="elem-input" data-price="[&quot;400&quot;]" type="checkbox">
       </label>         
   </li>
    <li class="elem-li">
        <label class="elem-label active">    
            <input class="elem-input" data-price="[&quot;&quot;]" type="checkbox">
       </label>         
   </li>
    <li class="elem-li">
        <label class="elem-label">    
            <input class="elem-input" data-price="[&quot;&quot;]" type="checkbox">
       </label>         
   </li>
</ul>

如果你决定继续使用.attr(),你也可以检查elemCt是否大于4,当引号之间没有数字时,你得到一个类似[""]的字符串,如果你取这个字符串的长度,你会得到4。所以你知道如果字符串长度超过4个字符,那么它的引号里就有一个数字。
一个二个一个一个

相关问题