0

私が行ったこのちょっとした jQuery は、いくらか改善され、よりきれいになる可能性があると感じています。私は間違っているかもしれませんが、何か考えやどのようにそれを行うことができますか?

jQuery("#user_type_2_wrapper label").addClass("active");
jQuery("#user_type_3_wrapper label i").hide();

jQuery('input[type="radio"]').on('change', function(){
  if (jQuery(this).val()=='2') {
    jQuery("#user_type_3_wrapper label").removeClass();
    jQuery("#user_type_3_wrapper label i").hide();
    jQuery("#user_type_2_wrapper label i").show();
    jQuery("#user_type_2_wrapper label").addClass("active");
  } else {
    jQuery("#user_type_2_wrapper label").removeClass();
    jQuery("#user_type_2_wrapper label i").hide();
    jQuery("#user_type_3_wrapper label i").show();
    jQuery("#user_type_3_wrapper label").addClass("active");
  }
});

HTML マークアップは次のようなものです。

<ul>
  <li id="#user_type_2_wrapper">
  <label>
    <i class="icon"></i>
    <input type="radio" value="2" />
    label text for option 2
  </label>
  </li>
  <li id="#user_type_3_wrapper">
  <label>
    <i class="icon"></i>
    <input type="radio" value="3" />
    label text for option 3
  </label>
  </li>
</ul>
4

2 に答える 2

0

削除するクラスを追加display noneしてから追加する場合、これにより表示と非表示の問題が処理されます。

adding/removing toggleまた、クラスの代わりに

.active
{
  //other props
  display:none;
}
于 2013-10-25T14:34:28.420 に答える