JQUERY:从选中了复选框的文本输入中更改值

时间:2014-02-23 21:10:06

标签: javascript jquery text input checkbox

只有选中了复选框,我才需要更改文本输入的值。两个输入(文本和复选框)都具有相同的类:

        

        <label for="text_to_apply">Write your text: </label>
        <input type="text" id="text_to_apply" name="text_to_apply" value="">
        <button type="button" id="btn_apply">Change</button>

        <form id="theform">
            <input type="text" value="1" id="one1" class="one"><input type="checkbox" id="one1_" class="one"><br>
            <input type="text" value="1" id="one2" class="one"><input type="checkbox" id="one2_" class="one"><br>
            <input type="text" value="1" id="one3" class="one"><input type="checkbox" id="one3_" class="one"><br>
            <input type="text" value="1" id="one4" class="one"><input type="checkbox" id="one4_" class="one"><br>
            <input type="text" value="2" id="two1" class="two"><input type="checkbox" id="two1_" class="two"><br>
        </form>
    </div>

    <script>
        $('#btn_apply').click(function() {
            var mytext = $('#text_to_apply').val();
            if ($('#theform').find('.one input:checked')) {
                $('#theform').find('.one:text').attr('value', mytext);
            }
        });
    </script>

</body>

我的想法已经不多了。请帮助!

谢谢!

3 个答案:

答案 0 :(得分:0)

尝试

    $('#btn_apply').click(function() {
        var mytext = $('#text_to_apply').val();
        $('#theform').find('input:checked').each(function(){
            $(this).prev().val(mytext);
        });
    });

DEMO

答案 1 :(得分:0)

如果我的问题是正确的 - 它将如下所示:

    $('#btn_apply').click(function() {
        if ($('#yourCheckboxId').is(':checked')){
             $('#inputId').val('some text you want');
        }            
    });

这是小提琴http://jsfiddle.net/Goodluck/2XBcK/

答案 2 :(得分:0)

我知道jQuery中没有:text。假设您的HTML保持不变,您可以使用.prev()方法在每个input:checked之前定位输入。

    $('#btn_apply').click(function() {
        var mytext = $('#text_to_apply').val();
        if ($('#theform').find('input:checked')) {
            $('#theform').find('input:checked').prev('input').attr('value', mytext);
        }
    });

小提琴:http://jsfiddle.net/willthemoor/5qmH8/