チェックボックスの状態を確認できません - jquery

Question

このonClickイベントを取得して、チェックボックスのチェック状態を制御することはできません。

 init: function() { 
      $('.billing input[type="checkbox"]').bind('click', function (e) { 
       e.preventDefault(); 
       iKeyless.page.toggleShippingForm($(e.currentTarget)); 
      }); 
     }, 
     toggleShippingForm: function (el) { 
      if (el.attr('checked')) { 
       $('.shipping').parents('.yui-u').addClass('hide'); 
       el.attr('checked', false); 
      } else { 
       $('.shipping').parents('.yui-u').removeClass('hide'); 
       el.attr('checked', true); 
      } 
     } 

チェックボックスがチェックされ、そうでないのに、それが...ちょうど<input>要素を参照するためにthisを渡す必要があります...かかわらず、私は何をすべきかの

Answer 1

をチェックしたままでそれをロードしますjQueryオブジェクトを必要とし、ここでは作業バージョンです：

init: function() { 
    $('.billing input[type="checkbox"]').bind('click', function (e) { 
     e.preventDefault(); 
     iKeyless.page.toggleShippingForm($(this)); 
    }); 
}, 
toggleShippingForm: function (el) { 
    if (el.attr('checked')) { 
     $('.shipping').parents('.yui-u').addClass('hide'); 
     el.attr('checked', false); 
    } else { 
     $('.shipping').parents('.yui-u').removeClass('hide'); 
     el.attr('checked', true); 
    } 
} 

しかし.checkedは、DOMプロパティなので、あなただけの（jQueryオブジェクトに変換せずに）これを行うことができます。

init: function() { 
    $('.billing input[type="checkbox"]').change(function (e) { 
     e.preventDefault(); 
     iKeyless.page.toggleShippingForm(this); 
    }); 
}, 
toggleShippingForm: function (el) { 
    $('.shipping').parents('.yui-u').toggleClass('hide', el.checked); 
} 

要素が変更されています.checkedステータス...既にchangeイベントで使用しています。必要に応じて、表示する方法に応じて.toggleClass('hide', el.checked)を.toggleClass('hide', !el.checked)に変更します。