使用jquery操作复选框和文本框

Manipulate checkbox and text box using jquery

本文关键字：文本 复选框 jquery 操作 使用      更新时间：2023-09-26

我在mypage中有以下代码，

    ....
    <input type="checkbox" title="Warehouse1" name="warehouse[]" id="selectedUser_1" class="select_checkbox" rel="warhouse_1" value="23">
    <input type="checkbox" title="Warehouse2" name="warehouse[]" id="selectedUser_2" class="select_checkbox" rel="warhouse_2" value="24">
    .....
    //text box to enter current stock for the above warehouses
    <input type="text" style="" name="current_stock[]" value="10" id="current_st_1" class="validtxt">
    <input type="text" style="" name="current_stock[]" value="11" id="current_st_2" class="validtxt">
    .....
<input type="button" id="check_warehouse_qty" name="check_warehouse_qty" value="OK">

当我点击按钮时，我需要用文本框存储各自的复选框值。例如我需要得到23_10,24_11。这样我就可以在隐藏文本框中赋值并做进一步的操作。

您需要这样做:

$('#check_warehouse_qty').click(function() {
    $('.select_checkbox').each(function() {
        var val = $(this).val();  // "23"
        var id = $(this).attr('id').replace('selectedUser_', '');
        val += $('#current_st_' + id).val(); // "23_10"
        // store 'val' in some hidden field
        $('hidden_field_' + id).val(val);
    });
});

我不确定我理解你想如何移动你的值，但这里有一个镜头。

您可以使用

设置表单字段的值:
$('#inputId').val(newVal);

在你的例子中，像这样的代码会将current_st_1的值移动到selectedUser_1的值:

$('#selectedUser_1').val($('#current_st_1').val());

如果你想要连接这些值，你可以使用:

$('#selectedUser_1').val($('#selectedUser_1').val() + '_' + $('#current_st_1').val());
下面是val()函数的jQuery API文档链接:http://api.jquery.com/val/

要获取/设置该值，您应该能够使用.val()，例如，类似于:

$('#current_st_1').val($('#selectedUser_1').val());

我想你需要这样的东西

<script type="text/javascript">
(function($) {
    $(function() {
        $('#check_warehouse_qty').click(function(e){
            //check if first checkbox is ticked
            if ($('#selectedUser_1').attr('checked')) {
                //checks if value was already put in
                if($('#current_st_1').val().indexOf($('#selectedUser_1').val()+'_') == -1){
                    //if it was not then set the value
                    $('#current_st_1').val($('#selectedUser_1').val()+'_'+$('#current_st_1').val());
                }
            }
            else{
                //remove value if unchecked
                $('#current_st_1').val($('#current_st_1').val().replace($('#selectedUser_1').val()+'_',''));
            }
            //check if second checkbox is ticked
            if ($('#selectedUser_2').attr('checked')) {
                //checks if value was already put in
                if($('#current_st_2').val().indexOf($('#selectedUser_2').val()+'_') == -1){
                    //if it was not then set the value
                    $('#current_st_2').val($('#selectedUser_2').val()+'_'+$('#current_st_2').val());
                }
            }
            else{
                //remove value if unchecked
                $('#current_st_2').val($('#current_st_2').val().replace($('#selectedUser_2').val()+'_',''));
            }
        });
    });
})(jQuery);
</script>
相关文章：