0

3 つのラジオ ボタンと、それぞれが 1 つのラジオ ボタンに属する 3 つのボタンがあります。対応するラジオボタンがチェックされている場合にのみ、ボタンを有効にしたい。

私のコードは機能しますが、最初にラジオボタンをクリックして機能を開始した場合にのみ機能します。一部のボタンが最初から無効になるように、機能を機能させるにはどうすればよいですか?

関数は次のようになります

$("input:radio[name=Kartenthema]").change(function() {         
      if (this.value == "Geburtenrate") {
         $("#karte_id").attr('src', 'kantone_interaktiv_geburten.svg');
         $("#legende_id").attr('src', 'Legenden/GebLegende.PNG'); 
         $("input[name=button1]").attr("disabled", true);
         $("input[name=button1]").addClass("disabledClass");
         $("input[name=button2]").attr("disabled", false);
         $("input[name=button2]:enabled").removeClass("disabledClass");
         $("input[name=button3]").attr("disabled", true);
         $("input[name=button3]:disabled").addClass("disabledClass");
      } else if (this.value == "Sterberate") {
         $("#karte_id").attr('src', 'kantone_interaktiv_sterbe.svg');
         $("#legende_id").attr('src', 'Legenden/SterbLegende.PNG');
         $("input[name=button1]").attr("disabled", true);
         $("input[name=button1]:disabled").addClass("disabledClass");
         $("input[name=button2]").attr("disabled", true);
         $("input[name=button2]:disabled").addClass("disabledClass");
         $("input[name=button3]").attr("disabled", false);
         $("input[name=button3]:enabled").removeClass("disabledClass");
      } else if(this.value == "Wanderung") {
         $("#karte_id").attr('src', 'kantone_interaktiv_wanderung.svg');
         $("#legende_id").attr('src', 'Legenden/WandLegende.PNG');
         $("input[name=button1]").attr("disabled", false);
         $("input[name=button1]:enabled").removeClass("disabledClass");
         $("input[name=button2]").attr("disabled", true);
         $("input[name=button2]:disabled").addClass("disabledClass");
         $("input[name=button3]").attr("disabled", true);
         $("input[name=button3]:disabled").addClass("disabledClass")                            
      }  
}

ラジオボタン/ボタンは次のようになります。

<embed id="legende_id" src="Legenden/GebLegende.PNG" width="180" height="230" style="margin-left:30px" type="image/PNG" />
<h3>
  <input type="radio" class="Radio" name="Kartenthema" value="Geburtenrate" checked="ckecked">Geburtenziffer
  <input type="button" class="Button" name="button2" value="Animation" onclick="location.href='animation_geburten.html'">
    <h3>
      <input type="radio" class="Radio" name="Kartenthema" value="Sterberate">Mortalität
      <input type="button" disabled="disabled" class="Button" name="button3" value="Animation" onclick="location.href='animation_mortalität.html'">
        <h3>
          <input type="radio" class="Radio" name="Kartenthema" value="Wanderung">Interkantonale Wanderung
          <input type="button" class="Button" name="button4" value="Animation" onclick="location.href='animation_wanderung.html'">
            <br>
              <br>
                <input type="button" class="Button" name="button1" value="Kartogramm" onclick="location.href='kartogramm.html'" />
              </br>
            </br>
          </input></input>
        </h3>
      </input></input>
    </h3>
  </input></input>
</h3>

入力タイプの後に無効にできることはわかっていますが、スタイルは有効から無効に変わりません。

4

3 に答える 3

0 
  if (this.value == "Geburtenrate") {

この行と次の 2 つの同様の行を次のように変更します。

  if ($(this).val() == "Geburtenrate") {
于 2013-05-14T10:52:49.813 に答える
0

問題ない。HTML コードを次のように変更してみてください。

<h3>
<input type="radio" class="Radio" name="Kartenthema" value="Geburtenrate" checked="ckecked">Geburtenziffer
<input type="button" class="Button" name="button2" value="Animation" onclick="location.href='animation_geburten.html'" disabled="disabled">
</h3>
<h3>
<input type="radio" class="Radio" name="Kartenthema" value="Sterberate">Mortalität
<input type="button" disabled="disabled" class="Button" name="button3" value="Animation" onclick="location.href='animation_mortalität.html'">
</h3>
<h3>
<input type="radio" class="Radio" name="Kartenthema" value="Wanderung">Interkantonale Wanderung
<input type="button" class="Button" name="button4" value="Animation" onclick="location.href='animation_wanderung.html'" disabled="disabled">
<br>
<br>
<input type="button" class="Button" name="button1" value="Kartogramm" onclick="location.href='kartogramm.html'" disabled="disabled">
<br>
<br>
</h3>
于 2013-05-14T12:29:54.460 に答える
0

$("input[name=buttonN]").removeAttr("disabled")を使用して、コントロールを有効に設定してみてください。

于 2013-05-14T11:14:48.740 に答える