这次给大家带来layui中的树形关于取值传值详解，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>
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
ajax请求data会遇到哪些问题
jquery实现点击a链接后此链接变为自定义色效果
jquery选择器一次性获取所有父级元素及以下元素
以上就是layui中的树形关于取值传值详解的详细内容。