表单提交后隐藏div

时间:2016-08-22 13:48:51

标签: javascript jquery html

如果span元素包含特定单词,我正在尝试隐藏div。 我遇到的问题是span仅在提交表单后才会显示。我试图运行提交按钮的隐藏功能on click,但这不起作用,因为仅在单击按钮并提交表单后才显示范围。我也尝试在表单的submit()上运行它,但也没有运气(发布了我在下面尝试过的代码)。

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>


<form id="discount-coupon-form" action="http://dev.blabla.co.uk/cart/couponPost/" method="post">
.....

<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>

</form>

的jQuery

 $j('#cartCoupon').click(function(){

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

我也试过

$j('#discount-coupon-form').submit(function(){
if ($j(".error-msg span:contains('blabla')").length) {
    $j('.deliveryUpsellText').css({
        "display":"none"
    });
  }
});

我有什么想法可以做到这一点?

1 个答案:

答案 0 :(得分:2)

您使用此字符作为引号:“

您应该使用以下其中一项:'或“

另外,你有这个:

  

onclick =“discountForm.submit(false);”

如果未定义对象 discountForm ,则在解析javascript部分之前会出现错误。

$(document).ready(function(){
$('#cartCoupon').on('click',function(){
if($('.error-msg').find("span:contains('blabla')").length > 0) {
    $('.deliveryUpsellText').hide();
  }
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<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>


<form id="discount-coupon-form" action="http://dev.blabla.co.uk/cart/couponPost/" method="post">
.....

<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>

</form>