我需要显示一个模式,如果这些字符串包含页面转换为格

问题描述:

例如,我有3个字符串来验证是否包含在一个页面中,如果这个字符串不在这个页面模式不加载页面,并且如果字符串包含在页面加载这将打开此模式。我需要显示一个模式,如果这些字符串包含页面转换为格

$(document).ready(function() { 
 
    $('.fl-product-ref').load(function(){ 
 
     var lightBox = $('.skuReference'); 
 
     switch(false) { 
 
     case (lightBox.find('LNC-L4139800')): 
 
     case (lightBox.find('LNC-L6669601')): 
 
     case (lightBox.find('LNC-L6669600')): 
 
      lightBox.removeClass('hidden').addClass('visible'); 
 
      break; 
 
     default: 
 
      lightBox.addClass('hidden'); 
 
      break; 
 
     } 
 
    }); 
 
}
<span class="fl-product-ref"> 
 
    <div class="skuReference">LNC-L4139800</div> 
 
</span> 
 

 
<div class="skuModal hidden"> 
 
    This is the modal! 
 
</div>

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 

    <style type="text/css"> 
     .hidden{ 
     visibility :hidden; 
    } 
    </style> 
</head> 
<body> 

<span class="fl-product-ref"> 
    <div class="skuReference">LNC-L4139800</div> 
    <div class="skuReference">LNC-L4139800</div> 
    <div class="skuReference">LNC-L6669601</div> 
    <div class="skuReference">LNC-L4139800</div> 
</span> 

<div class="skuModal hidden"> 
    This is the modal! 
</div> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    // $('.fl-product-ref').load(function(){ 
     var arr = $('.skuReference').map(function(index , val){ return $(val).text()}); 
     //["LNC-L4139800", "LNC-L4139800", "LNC-L6669601", "LNC-L4139800"] 

     switch(true) { 
     case ($.inArray("LNC-L4139800", arr) !== -1): 
     case ($.inArray("LNC-L6669601", arr) !== -1): 
     case ($.inArray("LNC-L6669600", arr) !== -1): 
      $('.skuModal').removeClass('hidden').addClass('visible'); 
      break; 
     default: 
      $('.skuModal').addClass('hidden'); 
      break; 
     } 
    //}); 
}); 
</script> 
</body> 
</html> 

switch语句使用严格的equals(===)来匹配它与一个case子句表达。

switch语句首先评估它的表达式。然后查找表达式的值与输入表达式的结果相同的第一个case子句(使用严格比较,===)

jQuery的find不返回布尔值,所以strict equals在这种情况下不起作用。

+0

这仅仅是问题...'find()方法的一部分'用于查询的元素,而不是文本 – charlietfl

+0

这是队伍不是必须的,你仍然可以使用''== – Vivick

我用jQuery :contains()选择器。

检查我的jsfiddle这里:Check if page contains certain strings of text, if so, do something

$(document).ready(function() { 
    if (($('body:contains("LNC-L4139800")').length > 0) 
     && ($('body:contains("LNC-L6669601")').length > 0) 
     && ($('body:contains("LNC-L6669600")').length > 0)) { 
       alert("launch modal"); 
    } 
}); 

了解更多关于:contains()选择在这里:https://api.jquery.com/contains-selector/重要提示:文本必须有匹配的情况下进行选择。

$(document).ready(function() { 
     var needleProducts= ['LNC-L4139800','LNC-L6669601','LNC-L6669600']; 
     var products = []; 
     var showModal = true; 
     $('.skuReference').each(function(){ 
      products.push($(this).text()); 
     }); 
     for(var i = 0; i < needleProducts.length; i++){ 
      if(find(products, needleProducts[i]) === -1){ 
      showModal = false; 
      } 
     } 

     if(showModal){ 
      $('.skuModal').removeClass('hidden').addClass('visible'); 
     } else { 
      $('.skuModal').addClass('hidden'); 
     } 
}); 

//crossbrowser method 
function find(array, value) { 
    if (array.indexOf) { // if method exist 
    return array.indexOf(value); 
    } 
    for (var i = 0; i < array.length; i++) { 
    if (array[i] === value) return i; 
    } 

    return -1; 
}