jquery获取checkbox选中的值并追加到input中

来源：互联网发布：天猫美工岗位职责编辑：程序博客网时间：2024/05/18 05:51

方法一：

<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>  </head><body><script>$(function(){    $("input[name='chbox']").change(function(){        var result="";        $("input[name='chbox']:checked").each(function(){               result+=$(this).val()+',';        });        if(result!=""){            result=result.substring(0,result.lastIndexOf(','));         }        $("#tinput").val(result);        });})</script><input type="text" id="tinput"/>        <div>            <input type="checkbox" name="chbox" value="10"/>aa            <input type="checkbox" name="chbox" value="20"/>bb            <input type="checkbox" name="chbox" value="30"/>cc            <input type="checkbox" name="chbox" value="40"/>dd            </div>          </body></html>

方法二：在layui 中实现

<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><link rel="stylesheet" href="css/style.css" type="text/css"/><link rel="stylesheet" href="layui/css/layui.css" type="text/css"/><script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script><script src="layui/layui.js"></script></head><body><form class="layui-form" > <input type="text" id="tinput"/>  <div class="layui-form-item">    <label class="layui-form-label">复选框</label>    <div class="layui-input-block">      <input name="like[write]" title="写作" type="checkbox" lay-filter="encrypt" value="10">      <input name="like[read]" title="阅读" type="checkbox" lay-filter="encrypt" value="20">      <input name="like[game]" title="游戏" type="checkbox" lay-filter="encrypt" value="30">    </div>  </div>    </form> <script>layui.use(['form'], function(){  var form = layui.form()  ,layer = layui.layer;       form.on('checkbox(encrypt)', function(data){  var result="";  if(data.elem.checked){     result =data.value+','+$("#tinput").val();}else{var a1=data.value;var a2=$("#tinput").val();var arr = a2.split(',');//字符串转数组var result="";$.each(arr, function(){var a=this;if(a1==a){return true;} result+=a+',';});  result=result.substring(0,result.length-1);//去掉最后一个“，”}               $("#tinput").val(result);      });                    });</script></body></html>

阅读全文

0 0