您好,欢迎访问一九零五行业门户网

layui中的树形关于取值传值问题解决办法

本文主要介绍了详解layui中的树形关于取值传值问题,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧,希望能帮助到大家
这个是我们需要的效果,实际操作中会先执行渲染 然后在执行方法,然后我们发现树形的json是空,调试了n遍一直以为是优先级别的问题了。
最后解决方案是
<script type="text/javascript"> ////layui 的 form 模块 var form = ""; layui.use(['form'], function () { // $ = layui.jquery; form = layui.form; //获取节点数据 gettreedata(); //return false; }); function gettreedata() { $.ajax({ //async: false, type: "post", url: "/api/webfw//getorgtree", datatype: "json", contenttype: "application/json; charset=utf-8", success: function (jdata) { var xtree1 = new layuixtree({ elem: 'xtree1', form: form, data: strtojson(jdata), isopen: true, //false初始关闭,true打开 click: function (data) { //节点选中状态改变事件监听,全选框有自己的监听事件 console.log(data.elem); //得到checkbox原始dom对象 console.log(data.elem.checked); //是否选中,true选中 alert(data.value); //弹出value值 } }); //获取选中val document.getelementbyid('btn1').onclick = function () { var ocks = xtree1.getchecked(); for (var i = 0; i < ocks.length; i++) { alert(ocks[i].value); } } //子节点选中改变,父节点更改自身状态 layuixtree.prototype.parendcheck = function (ckelem) { var _this = this; var xtree_p = ckelem.parentnode.parentnode; if (xtree_p.getattribute('class') == 'layui-xtree-item') { var xtree_all = _this.getchildbyclassname(xtree_p, 'layui-xtree-item'); var xtree_count = 0; for (var i = 0; i < xtree_all.length; i++) { if (_this.getchildbyclassname(xtree_all[i], 'layui-xtree-checkbox')[0].checked) { xtree_count++; } } if (xtree_count <= 0) { _this.getchildbyclassname(xtree_p, 'layui-xtree-checkbox')[0].checked = false; _this.getchildbyclassname(xtree_p, 'layui-xtree-checkbox')[0].nextsibling.classlist.remove('layui-form-checked'); } else { _this.getchildbyclassname(xtree_p, 'layui-xtree-checkbox')[0].checked = true; _this.getchildbyclassname(xtree_p, 'layui-xtree-checkbox')[0].nextsibling.classlist.add('layui-form-checked'); } this.parendcheck(_this.getchildbyclassname(xtree_p, 'layui-xtree-checkbox')[0]); } } //渲染之前按照选中的末级去改变父级选中状态 layuixtree.prototype.parentcheckboxchecked = function (e) { var _this = this; if (e.parentnode.parentnode.getattribute('class') == 'layui-xtree-item') { var _pe = _this.getchildbyclassname(e.parentnode.parentnode, 'layui-xtree-checkbox')[0]; _pe.checked = true; _this.parentcheckboxchecked(_pe); } } //获取全部选中的末级checkbox对象 layuixtree.prototype.getchecked = function () { var _this = this; var arr = new array(); var arrindex = 0; var cks = _this.getbyclassname('layui-xtree-checkbox'); for (var i = 0; i < cks.length; i++) { if (cks[i].checked && cks[i].getattribute('data-xend') == '1') { arr[arrindex] = cks[i]; arrindex++; } } return arr; } //获取全部的原始checkbox对象 layuixtree.prototype.getallcheckbox = function () { var _this = this; var arr = new array(); var arrindex = 0; var cks = _this.getbyclassname('layui-xtree-checkbox'); for (var i = 0; i < cks.length; i++) { arr[arrindex] = cks[i]; arrindex++; } return arr; } //根据值来获取其父级的checkbox原dom对象 layuixtree.prototype.getparent = function (a) { var _this = this; var cks = _this.getbyclassname('layui-xtree-checkbox'); for (var i = 0; i < cks.length; i++) { if (cks[i].value == a) { if (cks[i].parentnode.parentnode.getattribute('id') == _this._container.getattribute('id')) return null; return _this.getchildbyclassname(cks[i].parentnode.parentnode, 'layui-xtree-checkbox')[0]; } } return null; } } }); } function strtojson(str) { var json = (new function("return " + str))(); return json; } </script>
相关推荐:
总结微信小程序开发传值取值的几种方法
关于vue.js表单标签中的单选按钮、复选按钮和下拉列表的取值详解
微信小程序之传值取值方法总结
以上就是layui中的树形关于取值传值问题解决办法的详细内容。
其它类似信息

推荐信息