layui問題之模擬table表格中的選中按鈕選中事件
阿新 • • 發佈:2019-02-06
一、問題
不操作頁面,實現table表格中的checkbox選中功能
二、經過
剛開始的思路: 1、通過table的id,找到table渲染時生成的div,即table的下一個兄弟節點div.layui-table-view 2、由於checkbox是固定列,再通過第一步,找到div.layui-table-view的子元素.layui-table-fixed 3、緊接著,找出table的第一行的第一個td裡面的input,即tr[data-index="0"] td input(注:這個input的型別就是checkbox) 4、找到input的下一個兄弟節點,即div.layui-form-checked
layui.use(['table', 'form', 'layer', 'layedit', 'laydate'], function() {
// code
//模擬checkbox選中功能
var checkbox = $('#employeesTable').next().find('.layui-table-fixed tr[data-index="0"] td input');
checkbox.next().click();
});
結果可想而知,並沒有實現。在console中打印出來,找不到.layui-table-fixed,只能找到table裡面的<tbody></tbody>,而且裡面沒有子節點。
三、結果
想一下,大概是table渲染資料時,模擬checkbox選中功能已經開始執行了。更這段code加一個延遲,這個問題解決。
setTimeout(function () {
var td = $('#employeesTable').next().find('.layui-table-fixed tr[data-index="0"] td input');
td.next().click();
},3000);
PS:後臺在寫測試,需要操作頁面dom,用到了這種模擬事件。