最初にそれをブール値として扱うのはなぜですか？

Question

ラジオボタンに基づいて2つのdivの状態をトグルしたいと思います。値に基づいてdivの可視性を切り替えたい。 this.valueに基づいて最初のdivの表示と非表示が2番目の場合は!this.valueを使用していますが、動作していません。また、!Boolean(this.value)を試しました。

$('[name="radio"]').change(function() { 
 
    console.log(this.value,!this.value); 
 
    $('#first').toggle(this.value); // this works 
 
    $('#second').toggle(!this.value); // this one not 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input type="radio" name="radio" value="false" /> 
 
<input type="radio" name="radio" value="true" /> 
 

 
<div id="first">1</div> 
 
<div id="second">2</div>

なぜ最初のものは、ブール値と第2のではないとして、それを扱いますか？

Answer 1

はthis.valueので、両方がそう、それは常にfalseを与える否定truthy値です'true'または'false'いずれかの文字列です。それはあなたの第二の条件は、あなたが見ることができるように、valueの種類booleanでない

$('[name="radio"]').change(function() { 
 
    console.log(this.value, !this.value); 
 
    var value = this.value === 'true'; 
 
    $('#first').toggle(value); 
 
    $('#second').toggle(!value); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input type="radio" name="radio" value="false" /> 
 
<input type="radio" name="radio" value="true" /> 
 

 
<div id="first">1</div> 
 
<div id="second">2</div>

はまたtoggle()方法

toggle: function(state) { 
    if (typeof state === "boolean") { 
     return state ? this.show() : this.hide(); 
    } 

    return this.each(function() { 
     if (isHidden(this)) { 
      jQuery(this).show(); 
     } else { 
      jQuery(this).hide(); 
     } 
    }); 
} 

を見ている真になることはありませんですfirstの場合は常に文字列を渡しているため、常にトグルされます