2016-12-25 98 views
1

我已经根据选中的文本框中的文本更改了5个复选框。但是所有的复选框可以同时检查。我希望一次只检查一个复选框。如何根据复选框更改文本框的值

$(".check").change(function(){ 
     var text = ""; 
     $(".check:checked").each(function(){ 
      text += text != "" ? "^" : ""; 
      if ($(this).prop("checked")) 
       text += $(this).val(); 
     }); 
     $(".text").val(text); 
    }); 


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
    <input type="checkbox" class="check" value="Text1" /> 
    <input type="checkbox" class="check" value="Text2" /> 
    <input type="checkbox" class="check" value="Text3" /> 
    <input type="checkbox" class="check" value="Text4" /> 
    <input type="checkbox" class="check" value="Text5" /> 
    <br/> 
    <input type="text" class="text" /> 
+1

如果你只想要一个在同一时刻你为什么要使用chekboxes而不是单选按钮进行检查? –

+0

我只想选中复选框 –

+0

最简单的方法就是使用单选按钮......您试图让复杂的事情变得容易完成。顺便说一句,这是工作? – funilrys

回答

0

我不是JS专家,所以我接受建议,编辑,评论,澄清......

的想法是禁用其他复选框并追加选择的值到文本框。

var text = ""; 
 
// text += text != "" ? "^" : ""; 
 
$('.check').click(function() { 
 
    var $inputs = $('.check'); 
 
    if ($(this).is(':checked')) { 
 
     $inputs.not(this).prop('disabled', true); 
 
     if ($(this).prop("checked")) { 
 
      if (text !== "") { 
 
       text += "^"; 
 
      } 
 
      text += $(this).val(); 
 
      $(".text").val(text); 
 
     } 
 
    } else { 
 
     $inputs.prop('disabled', false); 
 
    } 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" class="check" value="Text1" /> 
 
<input type="checkbox" class="check" value="Text2" /> 
 
<input type="checkbox" class="check" value="Text3" /> 
 
<input type="checkbox" class="check" value="Text4" /> 
 
<input type="checkbox" class="check" value="Text5" /> 
 
<br/> 
 
<input type="text" class="text" />