本文实例讲述了jquery复选框多选赋值给文本框的方法。分享给大家供大家参考。具体实现方法如下： 复制代码 代码如下: jquery点击复选框触发事件给input赋值 <br /> * { <br /> margin: 0; <br /> padding: 0; <br /> list-style-type: none; <br /> } <br /> <br /> a, img { <br /> border: 0; <br /> text-decoration: none; <br /> } <br /> <br /> body { <br /> font: 12px/180% Arial, Helvetica, sans-serif, "新宋体"; <br /> } <br /> <br /> table { <br /> empty-cells: show; <br /> border-collapse: collapse; <br /> border-spacing: 0; <br /> } <br /> /* tablist */ <br /> .tablist { <br /> width: 400px; <br /> border: solid 8px #ddd; <br /> margin: 40px auto; <br /> } <br /> <br /> .tablist td { <br /> line-height: 24px; <br /> border-bottom: solid 1px #ddd; <br /> text-align: left; <br /> padding: 10px; <br /> } <br /> <br /> .tablist td input { <br /> line-height: 20px; <br /> margin-left: 5px; <br /> } <br /> .tablist td .txtValue <br /> <br /> { <br /> padding: 3px 0; <br /> width: 180px; <br /> } <br /> 全选 张三 李四 赵五 王六 <br /> $(function(){ <br /> $('[data-type="checkbox"]').click(function(){ <br /> var data_value = $(this).attr('data-value'), <br /> txtalso = $.trim($(".txtValue").val()); <br /> if($(this).prop("checked")) { <br /> if(txtalso.length > 0) { <br /> if(txtalso.indexOf(data_value+',') != -1) { <br /> return ; <br /> } else { <br /> txtalso += data_value + ','; <br /> } <br /> } else { <br /> txtalso = data_value+','; <br /> } <br /> } else { <br /> if(txtalso.indexOf(data_value+',') != -1) { <br /> txtalso = txtalso.replace(data_value+',', ''); <br /> } <br /> } <br /> $(".txtValue").val(txtalso); <br /> }); <br /> $('[data-type="checkall"]').click(function(){ <br /> var str = ''; <br /> if($(this).prop("checked")) { <br /> $.each($('[data-type="checkbox"]'), function(i){ <br /> str += $(this).attr('data-value') + ','; <br /> }); <br /> $('[data-type="checkbox"]').prop('checked', true); <br /> } else { <br /> $('[data-type="checkbox"]').prop('checked', false); <br /> } <br /> $(".txtValue").val(str); <br /> }); <br /> }); <br /> 希望本文所述对大家的jQuery程序设计有所帮助。
