php - ラジオボタンのクリックイベントで入力ボックスを非表示/表示する方法

Question

HTMLがラジオボタンのクリックイベントで入力フィールドを非表示および表示したい

<input type="radio" id="abc" name="abc1" checked = "checked" value="Experienced" />
<label> Experienced </label>  
<input type="radio" id="xyz" name="xyz1" checked = "checked"  value="Fresher" />
<label>Fresher</label>  
<input type="text"  name="cardno" id="tyx" /><br />
<p > Number</p>

私が欲しいのは、ラジオボタンをvalue="Fresher"クリックすると入力ボックスname="cardno"が非表示になることです。

jQueryを使用してこれを解決しようとしましたが、うまくいきません。

$(document).ready(function () {
    $("input[name$='abc1']").click(function () {
        var value = $(this).val();
        if (value == 'Experianced') {
            $("#tyx").show();
        } else if (value == 'Fresher') {
            $("#tyx").hide();
        }
    });

これを解決する方法を教えてくれる体はありますか？

Answer 1

クリックイベントをチェックするか、ラジオボタンの配列名を作成するには、ラジオボタンの名前を同じにする必要があります

以下のコードのように

<input type="radio" id="abc" name="abc1" checked = "checked" value="Experienced" />
<label> Experienced </label>  
<input type="radio" id="xyz" name="abc1" checked = "checked"  value="Fresher" />
<label>Fresher</label>  
<input type="text"  name="cardno" id="tyx" /><br />
<p > Number</p>

そして、次のような関数を作成します

$(document).ready(function () {
$("input[name$='abc1']").click(function () {
    var value = $(this).val();
    if (value == 'Experianced') {
        $("#tyx").show();
    } else if (value == 'Fresher') {
        $("#tyx").hide();
    }
});

私がもっとあなたを助けることができるなら、返信してください..

Answer 2

次で修正します。

$(document).ready(function () {
  $("input[type='radio']").click(function () {
    var value = $(this).val();
    if (value == 'Experianced') {
        $("#tyx").show();
    } else if (value == 'Fresher') {
        $("#tyx").hide();
    }
  });
});

Answer 3

Experiencedのタイプミスに加えて、ラジオ ボタンごとにクリック イベントを設定してみてください。

 $(document).ready(function() {
   $('input[name="abc1"][value="Experienced"]').click(function() {
     $("#tyx").show();
   });
   $('input[name="xyz1"][value="Fresher"]').click(function() {
     $("#tyx").hide();
   });
 });

ノート：

セレクターを単純化して、ID を使用することができます。

$('#abc')

と

$('#xyz')

Answer 4

HTML:

<input type="radio" id="abc" name="jobtype" checked = "checked" value="Experienced" />
<label> Experienced </label>  
<input type="radio" id="xyz" name="jobtype" checked = "checked"  value="Fresher" />
<label>Fresher</label>  
<input type="text"  name="cardno" id="tyx" /><br />
<p > Number</p>

同じグループのラジオボタンは同じでなければなりませんname

J:

$(document).ready(function () {
   $("input[name='jobtype']").click(function () {
      var value = this.value;
      if (value == 'Experienced') {
        $("#tyx").show();
      } 
     else{
        $("#tyx").hide();
      }
   });
});

Answer 5

スペルをに変更Experienced

使いました

if (value == 'Experianced')