我需要显示一个模式,如果这些字符串包含页面转换为格
问题描述:
例如,我有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在这种情况下不起作用。
答
我用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;
}
这仅仅是问题...'find()方法的一部分'用于查询的元素,而不是文本 – charlietfl
这是队伍不是必须的,你仍然可以使用''== – Vivick