2016-08-22 24 views
4

スパン内に特定のテキストが表示されている場合、divを非表示にしようとしています。それはクリックでdiv要素を隠しますが、それはif文を無視jQueryの特定のテキストがスパン内に表示されている場合はdiv divを表示します

$j('#cartCoupon').click(function(){ 
if($j(".error-msg span:contains('blabla')")){ 
    $j('.deliveryUpsellText').css({"display":"none"}); 
} 

}); 

HTML

<div class=“deliveryUpsellText”> 
<p>blabla</p> 
</div> 


<ul> 
    <li class=“error-msg”> 
    <ul> 
    <li> 
    <span> Coupon Code “blabla” is not valid 
    </span> 
    </li> 
    </ul> 
    </li> 
</ul> 


<button type="button" id="cartCoupon" title="Apply Coupon" class="button applycouponhide" onclick="discountForm.submit(false) ; " value="Apply Coupon"><span style="background:none;"><span style="background:none;">Apply</span></span></button> 

:私はjqueryのを使用していますし、これはコードです。だから、たとえスパンのテキストが「猫」だったとしても、まだdivを隠しています。誰かが私が間違って行ったことを発見できますか? #cartCouponボタンにはonclickイベントdicountForm.submit(false);があるため、deliveryUpsellTextはクリック時に非表示になっていますが、フォームの送信にはバインドされていないため、フォームが送信されると再び表示されます。誰でも私はそれを修正する方法を知っていますか?

答えて

1

jQueryコレクションは常に真実です(オブジェクトなので)。ノード(選択されたもの)が含まれているかどうかを確認する必要があります。このためlengthプロパティを使用します。

if ($j(".error-msg span:contains('blabla')").length) { 
    $j('.deliveryUpsellText').css({ 
     "display": "none" 
    }); 
} 
+0

や '$ jの( 'deliveryUpsellText')のための作業がトグル($ jの(です。長さ) ' – Rayon

+0

別の理由で私はうまくいきませんが、私は答えとして受け入れます – MariaL

0

この1

$(document).ready(function() { 
    $("#cartCoupon").click(function() { 
     var errMsg = $(".error-msg ul li span").text(); 
     if (errMsg.search("blabla") >= 0) { 
      $(".deliveryUpsellText").hide(); 
     } 
    }); 

}); 
0

を試してみてください、私はあなたがこのクエリを探していたと思います。 ): "( 'blabla')が含まれています。エラーMSGスパン"。!その、私

$(function(){ 
 
\t 
 
\t $('#cartCoupon').on('click', function(){ 
 
\t \t $('.error-msg').find('span').each(function(){ 
 
\t \t \t var text = $(this).text(); 
 
\t \t \t if(text.indexOf('blabla') >=0){ 
 
\t \t \t \t $(this).hide(); 
 
\t \t \t } 
 
\t \t }); 
 
\t }) 
 
});
<ul> 
 
    <li class="error-msg"> 
 
    <ul> 
 
    <li> 
 
    <span> Coupon Code “blabla” is not valid </span><br> 
 
    <span> Coupon Code is not valid </span><br> 
 
    <span> Coupon Code is not valid </span> 
 
    </li> 
 
    </ul> 
 
    </li> 
 
</ul> 
 
<button type="button" id="cartCoupon" title="Apply Coupon" class="button applycouponhide" value="Apply Coupon"><span style="background:none;"><span style="background:none;">Apply</span></span></button> 

関連する問題