页面包含单词时显示div

时间:2014-05-06 12:01:44

标签: javascript jquery html css

您好我希望根据页面内容显示div。它将在动态生成的商店页面上进行。我需要通知显示在购物车中的特定物品上 - 例如,如果有人在购物车中有“玩具青蛙”,则需要显示“青蛙促销活动”。

我一直在努力调整以下脚本/ html的用法

任何帮助表示赞赏。戴夫

<div class="contactUs"?>contact</div>
<div class="hideThis"?>xxx</div>

<script type="text/javascript">
if (jQuery("div.contactUs:contains('toy frog')").length) {
    jQuery(".hideThis").css("display","none");
}
</script>

=============================================== =============

到目前为止,感谢所有人的帮助..我对JS一无所知!

我不认为我已经清楚阅读/尝试所有这些......

我想要的是

1 **。当一个带有“subscrtiption”字样的产品被添加到我的购物车中时,我需要一条html消息来显示。**

我尝试了一些似乎适用于jsfiddle的示例,但不是在我的服务器上..这是常见的吗?

欢呼所有人......赞美。

3 个答案:

答案 0 :(得分:1)

我不明白您的代码示例(与您的问题描述相关:购物车内容与产品展示促销div),但我做了small code来回答您的问题。

HTML

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>

<!--   Into your page HTML, Imagine you have two parts -->

<!--   The first one is the cart that contain the item the user want to buy -->
<div class="cart">
  *Cart*
   <div class="sausages">sausages</div>
   <!-- Try to remove comment of code following -->
   <!-- <div class="fries">fries</div> -->
</div>

<br/>
<br/>

<!--   The second one is the content page that contain the div you want to display     according to item into your cart -->
<div class="content">
  *Content*
   <div class="sausages" style="display:none">sausages</div>
   <div class="fries" style="display:none">fries</div>
</div>

</body>
</html>

JS

var $content = $('.content');
var $cart = $('.cart');

// for each children element (el) into my div cart  
$cart.children().each(function(index, el) {

  // I try to find a element with my className into my div Content
  // And if I find it Then I show it
  $content.find('.' + el.className).show();
});

我更新了my code,评论更加清晰

答案 1 :(得分:0)

您可以使用is()

if( $('.contactUs').is(':empty') ) {
  // ...

或者您可以测试长度属性以查看是否找到了一个:

if( $('.contactUs:empty').length ) {
   // ...

请记住,空也意味着没有什么空间。如果有可能存在空格,那么您可以使用$ .trim()并检查内容的长度。

if( !$.trim( $('.contactUs').html() ).length ) {
// ...

答案 2 :(得分:0)

var contactDivText = $('.contactUs').text();
var hideDiv = $('.hideThis');
if(contactDivText == ''){
    hideDiv.hide();
}else{
    hideDiv.text(contactDivText);
}