在复选框上更改文本输入值

Andy Andy 发表于 Dev

安迪安迪

我正在尝试将value复选框的输入到文本输入中。

假设输入框为空-单击复选框，分配给checbkox的值将显示在输入框内。

$('input.lowercase').on('change', function(){
      if ( $(this).is(':checked') ) {
$("input.qwer").on("keyup",function () {
    $("input.qwer").html($(this).val());
}); } } );

不管我做什么，我都无法正常工作。有什么帮助吗？http://jsfiddle.net/6ycnzrty/

Weafs.py

[编辑]（根据您的需要）

示范 `Fiddle`

HTML：

<input type="text" class="output" value="" />
<br>
<input type="checkbox" class="qwer" value="qwerty">Input value of this checkbox(qwert)
<br>
<input type="checkbox" class="numbers" value="1234567890">Input value of this checkbox(numbers)
<br>
<input type="checkbox" class="asdfg" value="asdfg">Input value of this checkbox(asdfg)
<br>
<input type="checkbox" class="zxcvb" value="zxcvb">Input value of this checkbox(zxcvb)

JavaScript：

$('input.qwer').on('change', function () {
    if ($(this).is(':checked')) {
        $('.output').val($('.output').val() + $(this).val());
    } else {
        $('.output').val($('.output').val().replace($('.qwer').val(), ''));
    }
});

$('input.numbers').on('change', function () {
    if ($(this).is(':checked')) {
        $('.output').val($('.output').val() + $(this).val());
    } else {
        $('.output').val($('.output').val().replace($('.numbers').val(), ''));
    }
});

$('input.asdfg').on('change', function () {
    if ($(this).is(':checked')) {
        $('.output').val($('.output').val() + $(this).val());
    } else {
        $('.output').val($('.output').val().replace($('.asdfg').val(), ''));
    }
});

$('input.zxcvb').on('change', function () {
    if ($(this).is(':checked')) {
        $('.output').val($('.output').val() + $(this).val());
    } else {
        $('.output').val($('.output').val().replace($('.zxcvb').val(), ''));
    }
});