选中复选框时在文本框中显示数据

Question

我有三个具有 id text1、text2、text3 的文本框和一个具有 id 检查的复选框。我在第一个文本框中显示一些内容，比如说 10。现在如果我选中复选框，那么第二个文本框中将自动显示“20”。第三个文本框保持不变。 如果我将在第一个和第二个文本框中显示一些内容，现在如果我选中复选框，那么相同的“20”将显示在第三个文本框中。检查是否在任何时候我都会取消选中该复选框，然后值“20”也将从文本框中删除（第二个或第三个）有什么想法吗？请放轻松

index.jsp

<input type="checkbox" id="check"/>

<input type="text" id="text1" value="10"/>
<input type="text" id="text2"/>
<input type="text" id="text3"/>

Answer 1

你的问题不好理解....

选中复选框时，下一个空输入文本必须显示“20”值？ 如果未选中复选框，则最后输入 '20' 是清除值？

为每个输入文本添加“checker”类。

<input type="checkbox" id="check"/>
<input type="text" id="text1" value="10" class="checker"/>
<input type="text" id="text2" class="checker"/>
<input type="text" id="text3" class="checker"/>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
<br/>
<input type="text" id="anotherTB" value="100"/>

使用这个jquery 脚本代替你的

$(document).ready(function(){
    $('#check').click(function(){

        if($(this).is(':checked'))
        {
            var stop='';
            $('.checker').each(function(){
                if($(this).val()=='' && !stop)
                {
                   $(this).val('20');
                    stop='stop'; 
                   // Add something like that to set other textbox values
                   var add = parseInt($('#anotherTB').val()) + parseInt($(this).val());
                   $('#anotherTB').val(add); 
                }
            });
        }

        else if(!$(this).is(':checked'))
        {
            $('.checker').each(function(){
                if($(this).val()=='20')
                {
                   $(this).val('');
                }
            });
        }
    });
});

你可以在这里看到它的工作原理：http://jsfiddle.net/w9hAZ/1/

Answer 2

 $('#check').change(function(){if($(this).is(':checked'))$('#text2').val(20);});

如果要在未选中时清除该值：

 $('#check').change(function(){if($(this).is(':checked'))$('#text2').val(20);else $('#text2').val(''); });