0

ラジオボタンにdivを表示するために単純な表示/非表示を行いたいフォームフィールドを作成しています。

<form id="basic" name="basic">

<label><input name="formelement" type="radio" value="yes" /> Yes   </label>
<label><input name="formelement" type="radio" value="no" /> No </label>

<div id="yes" style="display: none;">
This is the div that displays that shows when 'Yes' is selected.
</div>

<div id="no" style="display: none;">
This is the div that displays that shows when 'No' is selected.
</div>

</form>

私はオンラインで見つけたいくつかのさまざまな JavaScript を試してみましたが、オンラインで 1 つの div を表示/非表示にすることができるため、あまり成功していません。「いいえ」が選択されたときに「はい」を非表示にし、その逆を行うのは難しい部分です。誰かが本当に感謝されるいくつかの支援を提供できれば!

4

3 に答える 3

3

これらのコードを head タグの間に貼り付けるだけです

<script type="text/javascript">
window.onload=function(){
    var el1 = document.getElementsByName('formelement')[0];
    var el2 = document.getElementsByName('formelement')[1];  
    el1.onchange=function(){
        var show=el1.value;
        var hide=el2.value;
        document.getElementById(show).style.display='block';
        document.getElementById(hide).style.display='none';
    }

    el2.onchange=function(){
        var show=el2.value;
        var hide=el1.value;
        document.getElementById(show).style.display='block';
        document.getElementById(hide).style.display='none';
    }  
}
</script>

デモ。

于 2012-07-05T04:28:46.117 に答える
0

以下は、radioの値がdivのidと同じであると想定しています。

function getRadioVal(name){
   var oRadio = document.forms[0].elements[name];
   for(var i = 0; i < oRadio.length; i++)
      if(oRadio[i].checked)
         return oRadio[i].value;
   return '';
}

//hide both divs..
document.getElementById("yes").style.display = "none";
document.getElementById("no").style.display = "none";

//show only one of them..
document.getElementById(getRadioVal("formelement")) = "block";

ライブラリなしでjavascriptを扱うのは、物事が複雑になると面倒です。jQueryなどのライブラリをお勧めします。

于 2012-07-05T04:10:24.553 に答える
0

これはあなたが望むものです

JavaScriptでラジオボタンが選択されているかどうかを確認するにはどうすればよいですか？

onclickイベントを割り当てれば、準備は完了です。

于 2012-07-05T04:10:43.663 に答える