选择单选按钮时清除输入

Question

我有两个单选按钮可以添加和删除 div（参见代码片段）

现在，当您从一个按钮切换到另一个按钮时，我需要清除输入文本。

例如，如果您 select 编辑了 "One" 并输入 "name"，当您 select "Two" 时，输入文本应该被重置空白（反之亦然）

我该怎么做？

$(function(){

  let content=[
    '<div class="added"> HELLO </div>',
    '<div class="added"> BYE </div>'
  ];
  let toggled=0;
    
$("[name='something']").on('change', function(){
    $(".added").remove();
    toggled=(toggled+1)%2;
    $(".toadd").append(content[toggled])
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="toadd">
  
  <label>One</label><input type="radio" class="first" name="something" checked />
  <label>Two</label><input type="radio" class="second" name="something" />
  
  <input type='text' class='toclear'>
  
  <div class="added"> HELLO </div>
  
</div>

Answer 1

使用 .val('') 您可以将输入设为空白：

$(function(){

  let content=[
    '<div class="added"> HELLO </div>',
    '<div class="added"> BYE </div>'
  ];
  let toggled=0;
    
$("[name='something']").on('change', function(){
    $(".added").remove();
    toggled=(toggled+1)%2;
    $(".toadd").append(content[toggled])
    $(".toclear").val('');
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="toadd">
  
  <label>One</label><input type="radio" class="first" name="something" checked />
  <label>Two</label><input type="radio" class="second" name="something" />
  
  <input type='text' class='toclear'>
  
  <div class="added"> HELLO </div>
  
</div>

选择单选按钮时清除输入

Clear input when selecting radio button

input

append

toggle

radio-button