0

次のようなボタンがあります。

input type="submit" name="continue" id="continue" value="CONTINUE" class="submitContact" />

次に、このボタンのために、次のような js を設定しています。

$('#continue').click(function() {
    $('#storePickUp').change(function() { //catch checkbox
        var $check = $(this),
        $div = $check.parent();
    if($check.prop('checked') || $('#shippingZipCode').val().length) 
    {
    $('.checkoutForm').fadeIn(1000);
    }
    else {
document.getElementById(shippingZipCode).style.backgroundColor = '#FFFEAD'; 
    }
  });

});

私がやろうとしているのは、テキストボックス.shippingZipCodeに入力されているか、チェックボックスがチェックされているかを確認することです。#storePickUp肯定的であれば、クラスを持つ div を表示します.checkoutForm。

しかし、私はそれを機能させることができません。このjsは大丈夫ですか？

ありがとう！

4

2 に答える 2

1

submitあなたのクリックイベントは、入力された入力から来ています。したがって、まず最初に、return false投稿とリダイレクトを防止する必要があります。

次に、クリック イベントは変更イベントのみを割り当てています。変更イベントは、選択された入力に変更が加えられると、割り当てられたコールバックを発行します。これは、ページがポストされる数ミリ秒よりも確実に短い時間ではない場合があります。

値を確認し、実行するアクションを決定してから、投稿が行われないように false を返します。

$('#continue').click(function() {
  var $check = $('#storePickUp');//use reference to check for value immediately
  var $div = $check.parent();
  if($check.prop('checked') || $('#shippingZipCode').val().length) 
  {
   $('.checkoutForm').fadeIn(1000);
  }
  else {
   document.getElementById('shippingZipCode').style.backgroundColor = '#FFFEAD'; 
  }
  return false;//prevent form from posting
});
于 2013-06-06T19:48:31.273 に答える
0

チェックボックスの変更機能は必要ありません。その状態を確認するだけです。

$('#continue').click(function() {
    var $check = $('#storePickUp'),
    $div = $check.parent();

    if($check.prop('checked') || $('#shippingZipCode').val().length) {
        $('.checkoutForm').fadeIn(1000);
    } else {
        document.getElementById('shippingZipCode').style.backgroundColor = '#FFFEAD';
    }
});
于 2013-06-06T19:43:56.433 に答える