在同一页面上的表中显示复选框和表单数据

Display checkbox and form data in a table on the same page

本文关键字:复选框 显示 表单 数据 一页      更新时间:2023-09-26

jsfield - http://jsfiddle.net/yeyene/S4FT7/

我修改了上面的jsfiddle示例,以便在同一页面上获取表的复选框值。问题是它给了我所有的复选框值,甚至没有选择。谁来帮我解决这个问题。由于

$(document).ready(function(){
    $('#submit').on('click',function(){
        var st = '';
        $('#myForm input[type=text],input[type=password],select,input[type=checkbox]').each(function(){
            st = st+ '<td>'+$(this).val()+'</td>';
            $(this).val('');
        });
        $('#details').append('<tr>'+st+'</tr>');
    });
});

change input[type=checkbox] to input[type=checkbox]:checked

试试这个:-

$(document).ready(function(){
$('#submit').on('click',function(){
    var st = '';
    $('#myForm input[type=text],input[type=password],select,input[type=checkbox]:checked').each(function(){
        st = st+ '<td>'+$(this).val()+'</td>';
        $(this).val('');
    });
    alert(st);
    $('#details').append('<tr>'+st+'</tr>');
   });
 });
演示

我调整了一些代码,使它更简单。

$(':input')可以得到任何输入,包括你的select。

如果它是复选框,你必须添加$('input[type="checkbox"]:checked')来获得你选择的值。

$(document).ready(function(){
    $('#submit').on('click',function(){
        var st = '';
        $(':input[type!="button"]').each(function(){
            if(this.value){
                st = st+ '<td>'+$(this).val()+'</td>';
                    $(this).val('');
            }
        });
        $('#details').append('<tr>'+st+'</tr>');
    });
});

JSFIDDLE