Question

我有一组4个单选按钮，后跟文本输入，当用户点击文本输入字段时，我试图清除所有无线电输入。到目前为止，这是我的代码。

 <input type="radio" name="radio"><label for="radio1">1</label>
 <input type="radio" name="radio"><label for="radio2">2</label>
 <input type="radio" name="radio"><label for="radio3">3</label>
 <input type="radio" name="radio"><label for="radio4">4</label>
 <input type="text" id="textInput">

 <script>
      $('#textinput').click(function () {
          radio.checked = false;
      });
 </script>

Answer 1

您可以使用.prop()设置输入rabio按钮的已检查属性。在事件绑定

时，您也拼错了textInput

<script>
      $('#textInput').click(function () {
          $('input[name="radio"]').prop("checked", false);
      });
 </script>

DEMO

Answer 2

<script>
      $('#textInput').click(function () {
          $('input[type=radio]').removeAttr("checked");

      });
 </script>

Answer 3

或者您可以尝试attr（）方法

 $('#textInput').click(function () {
         $('input[name="radio"]').attr('checked',false);

      });

DEMO

Answer 4

我认为修改脚本块（不更改html）的最佳方法是首先确保代码在文档准备就绪时运行，并且您应该确保事件是焦点，而不是单击，以防有人使用键盘或替代导航：

$(function() {
    $('#textInput').focus(function () {
          $('input[name=radio]').prop("checked", false);
    });
});

虽然您可能更有可能只想清除其他选择，如果他们实际在该字段中输入了一些数据，您可能希望改为：

$(function() {    
    $('#textInput').on('input', function () {
        if($(this).val().length > 0) {
            $('input[name=radio]').prop("checked", false);
        }
    });
});

单击文本输入时清除单选按钮

4 个答案: