ラジオボタン付きの2つのテキストフィールドがあります。
最初のボタンをクリックすると、そのテキストフィールドがアクティブになり、他のテキストフィールドが非アクティブになります。
しかし、2番目のボタンをクリックすると、両方のテキストフィールドがアクティブモードになります。
ボタンをクリックするとアクティブになるフィールドが1つだけ必要で、他のフィールドは非アクティブモードにする必要があります。
私はこのHTMLコードを持っています
<form name="myform" action="">
<input type="radio" id="yourBox" value="text1" style="margin-left: 15px; margin-right: 5px;" />
<input type="text" `enter code here`id="yourText" disabled="disabled" style="margin-left: 15px; width: 349px;" />
<input type="radio" id="yourBox1" value="text2" style="margin-left: 30px;margin-right: 5px;" />
<input type="text" id="id2" disabled="disabled" style="margin-left: 15px; width: 352px;" />
</form>
私のJavaScriptコードを見つけてください：
<script>
document.getElementById('yourBox').onchange = function() {
document.getElementById('yourText').disabled = !this.checked;
};
document.getElementById('yourBox1').onchange = function() {
document.getElementById('id2').disabled = !this.checked;
};
</script>
まず第一に、あなたはあなたのコードにタイプミスがあります。次に、効率を上げるためにコードを改善する必要がありますが、これはあなたが求めている範囲外です。元の投稿から変更された作業コードは次のとおりです。
<form name="myform" action="">
<input type="radio" id="yourBox" value="text1" style="margin-left: 15px; margin-right: 5px;" />
<input type="text" value="enter code here" id="yourText" disabled="disabled" style="margin-left: 15px; width: 349px;" /><br/>
<input type="radio" id="yourBox1" value="text2" style="margin-left: 30px;margin-right: 5px;" />
<input type="text" id="id2" disabled="disabled" style="margin-left: 15px; width: 352px;" />
</form>
<script>
var yourBox = document.getElementById('yourBox');
var yourBox1 = document.getElementById('yourBox1');
yourBox.onchange = function() {
yourBox1.checked = !this.checked;
document.getElementById('yourText').disabled = !this.checked;
document.getElementById('id2').disabled = this.checked;
};
yourBox1.onchange = function() {
yourBox.checked = !this.checked;
document.getElementById('id2').disabled = !this.checked;
document.getElementById('yourText').disabled = this.checked;
};
</script>
これがJSFiddleです：http：//jsfiddle.net/swfh0qo5/
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加