如果多个跨度有不同的值，显示警报

我有一个由JavaScript/jQuery创建的产品（如购物车）列表。在列表中，所有项目必须属于一个主要类别。如果多个跨度有不同的值，显示警报

例如，您不能将INDUSTRIAL-A和INDUSTRIAL-B中的物品放在同一个清单中。

HTML例如：

<div id="{{divId}}" class="cart__row wishl-row" data-item="{{itemId}}" data-tags="{{product.tags}}"> 
    <div class="grid--full cart__row--table-large"> 
     <div class="grid__item large--three-fifths"> 
      <div class="grid"> 
       <div class="grid__item one-third"> 
        <a href="{{product.url}}?variant={{variant.id}}" title="{{product.title}}" class="cart__image"> 
         <img src="{{featuredImage}}" alt="{{product.title}}" /> 
        </a> 
       </div> 
       <div class="grid__item two-thirds"> 
        <a href="{{product.url}}?variant={{variant.id}}" title="{{product.title}}" class="h4 cart__product-name">{{{product.title}}}</a> 
        <ul> 
         <li> 
          <span class="variant-option-key">{{this.name}}:</span> {{this.value}} 
         </li> 
        </ul> 
        <span class="variant-title">{{variantTitle}}</span> 
        <ul> 
         <li> 
          <span class="property-key">{{@key}}:</span> {{this}} 
         </li> 
        </ul> 
       </div> 
      </div> 
     </div> 
     <div class="grid__item large--two-fifths"> 
      <div class="grid--full cart__row--table"> 
       <div class="grid__item two-thirds text-center"> 
        <p class="h4 cart__product-name"> 
         <span class="categori" style="font-weight: 600;">{{ product.tags }}</span> 
         <br /> 
         <span class="category">{{ product.tags }}</span> 
        </p> 
       </div> 
       <div class="grid__item one-third text-right wishl-item-actions"> 
        <a href="#" class="wishl-del" data-item="{{itemId}}" data-item-title="{{product.title}}">{{deleteLabel}}</a> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

的<span>与不能重复具有类属性 “categori” 的文字。如果列表中的每个项目都有INDUSTRIAL-A，那么没有alert。如果存在INDUSTRIAL-A和INDUSTRIAL-B，则触发alert。

现在我有这样的代码，但它甚至产生一个alert当所有项目具有产业-A：

var array = ["INDUSTRIAL-A", "INDUSTRIAL-B"]; 

$(array).ready(function() { 

    // Using :contains() 
    $("span.categori:contains(" + this + ")").ready(function() { 
     setTimeout(function() { 
      alert("You have items from different category grades."); 
     }, 1); 
    }); 
});

我也试过这个代码：

var array = ["INDUSTRIAL-A", "INDUSTRIAL-B"]; 

$(array).ready(function() { 

    // Using :filter() 
    $("span.categori:filter(" + this + ")").ready(function() { 
     setTimeout(function() { 
      alert("You have items from different category grades."); 
     }, 1); 
    }); 
});

任何帮助将是非常赞赏。谢谢！

来源

2017-03-02 Matthew Lafleur-Harewood

获取与ID类别的所有文本，并将其推送到一个数组！接下来你可以检查所有元素是否相同或不是真或假！

function checkForSameIndustry(){ 
    var span_text_array = []; 
    $("span[id=categori]").each(function(index, elem){ 
     span_text_array.push($(this).text()); 
    }); 
    if(span_text_array.length > 0){ 
     return (!!span_text_array.reduce(function(a, b){ return (a === b) ? a : NaN; })); 
    }else{ 
     return true; 
    } 
}

希望有所帮助！

来源

2017-03-02 04:01:22

我会喜欢这个下面的例子，你可以遍历每个数组项并检查你的列表选择器。我希望我开车你在正确的方向：

$(function() { 
 
    var array = ['INDUSTRIAL-A', 'INDUSTRIAL-B']; 
 

 
    array.forEach(function(t) { 
 
    $("span.categori:contains(" + t + ")").each(function() { 
 
     setTimeout(function() { 
 
     alert('You have items from different category grades.'); 
 
     }, 1); 
 
    }); 
 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="categori">INDUSTRIAL-A</span> 
 
<span class="categori">INDUSTRIAL-C</span>

来源

2017-03-02 04:49:11

如果多个跨度有不同的值，显示警报

回答

相关问题