选中复选框时在文本框中显示数据 [英] display data in a textbox when checkbox is checked

问题描述

我有三个带有 id text1、text2、text3 的文本框和一个带有 id 检查的复选框.我在第一个文本框中显示一些东西，比如说 10.现在，如果我选中复选框，那么20"将自动显示在第二个文本框中.第三个文本框保持不变.如果我将在第一个和第二个文本框中显示某些内容，现在如果我将选中复选框，则在第三个文本框中将显示相同的20".签入后，我将取消选中该复选框，然后值20"也将从文本框中删除(第二个或第三个)知道吗?请对我放轻松

I have three text boxes having id text1, text2, text3 and one checkbox having id check. I am displaying something in first textbox let's say 10. Now if i will check checkbox then automatically "20" will be displayed in the second textbox. Third textbox remains same as it is. If I will display something in 1st and 2nd textboxes, now if i will check checkbox then same "20" will be displayed in 3rd textbox. After checked if in anytime i will uncheck the checkbox then value "20" will also be removed from the textbox(either 2nd or 3rd) Any idea please? Please be easy with me

index.jsp

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

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

推荐答案

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

Your question is not easy to understand....

当复选框被选中时，下一个空输入文本必须显示20"值?如果复选框未选中，最后一个输入20"是清除值?

When checkbox is checked the next empty input text have to display '20' value ? And if checkbox is unchecked last input with '20' is cleared value ?

为每个输入文本添加checker"类.

Add the "checker" class to each input text.

<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 脚本代替你的

Use this jquery script instead of yours

$(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/

You can see it work here : http://jsfiddle.net/w9hAZ/1/

这篇关于选中复选框时在文本框中显示数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！