单选按钮(如果单击)

Radio Button if on click

本文关键字:单击 如果 单选按钮      更新时间:2023-09-26

我想在单选按钮中添加 if/else if 当点击

  • 如果我单击选中的无线电值"无线电 1"我可以单击收音机值"无线电子 1"或"无线电子 2"和禁用文本框"更多"

  • 如果我单击选中收音机值"收音机2"禁用文本框"更多"并禁用单选按钮值"子1电台"或"子2电台"(子电台)

  • 如果我单击选中的无线电值"无线电 3"我可以输入文本框"更多"并禁用无线电值"子1电台"或"子2电台"(子电台)

  • 否则我不检查收音机必须禁用文本框"更多"并禁用单选按钮值"子1电台"或"子2电台"(子电台)

这是我的代码

<input type="radio" name="myradio" value="Radio 1" >
<label>Radio 1</label> &nbsp; &nbsp;
<input type="radio" name="mysubradio" value="Radio Sub 1"  >
<label>Radio Sub 1</label> &nbsp; &nbsp;
<input type="radio" name="mysubradio" value="Radio Sub 2"  >
<label>Radio Sub 2</label> &nbsp; &nbsp;
<br/><br/>
<input type="radio" name="myradio"  value="Radio 2" >
<label>Radio 2</label> <br/><br/>
<input type="radio" name="myradio" value="Radio 3" >
<label>Radio 3</label> 
<input name="more" placeholder="more" maxlength="50" type="text" >

你可以在这里测试代码 Js 小提琴

帮帮我,谢谢:)

为了方便起见,我使用了jQuery,但它不是学习JavaScript基础知识的最佳方式。因此,请使用此解决方案作为演示来发现您可以使用JavaScript和jQuery做什么,但是当您开始学习它时,请仅从JavaScript开始。

这是您可以执行的来实现之前提到的逻辑的操作:

$('input').click(function() {
// Will be equal to the value of the selected radio
var myradio = $('input[name="myradio"]:checked').val();
if (myradio === 'Radio 1')
{
    // Enable subradios
    $('input[name="mysubradio"]').prop('disabled', false);
    // Disable textbox
    $('input[name="more"]').prop('disabled', true);
}
else if (myradio === 'Radio 2')
{
    // Disable subradios
    $('input[name="mysubradio"]').prop('disabled', true);
    // Disable textbox
    $('input[name="more"]').prop('disabled', true);
}
else if (myradio === 'Radio 3')
{
    // Disable subradios
    $('input[name="mysubradio"]').prop('disabled', true);
    // Enable textbox
    $('input[name="more"]').prop('disabled', false);
}
});

我已经在这里更新了你的JSFiddle。现在,我建议你从教程开始学习JavaScript,然后发现jQuery,以便理解我给你的代码。

干杯