layui 各項配置


第一、如何全部選中table中每一條記錄

1.首先給table的父類設置一個唯一id *這種方式不推薦,效果比較差,推薦第2種方式
再搜索 alias-table div.layui-table-fixed.layui-table-fixed-l下面的i元素
var bbcc = $('#alias-table   div.layui-table-fixed.layui-table-fixed-l 
  div.layui-table-cell.laytable-cell-1-0-0.laytable-cell-checkbox 
  div.layui-unselect.layui-form-checkbox i')

bbcc.each(function (index, element) {
element.click();
});

2.直接搜索layui-table-header,會搜索出3個,直接選第2個,具體如下
var html=$('.layui-table-header table i.layui-icon.layui-icon-ok')[1];
html.click();

 第二、如何獲取彈出層iframe內容

1.首先給iframe內想要獲取的元素添加唯一的id
2.具體如下:
$('#button-order-alladd').click(function () {
layer.open({
type:2,
title:"你好",
closeBtn:1,
area:["500px","320px"],
content:"{% url 'test:ceshi' %}",
btn:['確定', '取消'],
yes:function(index, layero){
var body=layer.getChildFrame('body',index); #使用layer.getChildFrame獲取iframe內的body部分內容
var test_t=body.find('#textarea-order').val(); #再通過find查到唯一的id
layer.close(index);
},
cancel:function(index, layero){
layer.close(index);
return false;
},
});
});

 第三、如何利用iframe加載html(layer.open)

加載layui.layer,然后利用layer.open加載iframe
$('#button-order-alladd').click(function () {
    layer.open({
        type:2,
        title:"批量增加",
        closeBtn:1,
        area:["500px","320px"],
        content:"{% url 'ceshi:test' %}",   #加載html路徑
        btn:['確定', '取消'],
        yes:function(index, layero){
            var body=layer.getChildFrame('body',index);
            var test_t=body.find('#textarea-order').val();          
            testdata=JSON.stringify(test_t.trim().split(" "));
            layer.close(index);
            $.ajax({
                url:"{% url 'ceshi:data' %}",
                method:"post",
                headers: {"X-CSRFToken": token_value},
                cache:false,
                data:{
                    data:testdata,
                    check:checkSelect
                },
                success:function () {
                    table.reload('ordertest',{url:"{% url 'ceshi:data' %}",where:{"check":checkSelect}})
                }
            });
        },
        cancel:function(index, layero){
            layer.close(index);
            return false;
        },
    });
});

 第四、iframe里的內容如何選中radio按鈕,checkbox類同

接上第三,上面的layer.open的內部操作,首先需要獲取到input元素

 

 

 <input type="radio" name="limits1" value="DELETE" title="DELETE" checked="checked">

這樣是不可以操作,需要在元素加上$,讓它重新封裝成一個jquery元素,才可進行一些,點擊操作,效果如下:

var body=layer.getChildFrame('body', index);
test=body.find("input[name='limits1']");
test_data=test;   #用於下面的第三種方法,直接獲取icon
for (var n=0;n<test.length;n++){
if (test[n].title===obj.data.ceshi){
 console.log('測試'); console.log(test[n]); #這個是獲取到純元素如上圖1,這樣是不可以操作例如。attr prop等都是不可以
        console.log($(test[n]));   #這個是對獲取到的純元素重新封裝為jquery對象,才可以進行操作,如上圖2
        $(test[n]).attr('checked','checked'); //test_data.eq(n).next('div').children('i.layui-anim.layui-icon').click(); #這是另外一方式,對icon進行點擊,以達到選中,但需要在遍歷之前,先把值賦給另外一個變量,不能在當前遍歷中進行直接操作
}};
#執行后,需要對form表單重新進行刷新,否則是看不出效果,如果是使用icon點擊是不需要刷新,其它都需要刷新
var iframeWin = layero.find('iframe')[0].contentWindow; #layero是layer.open中sucess里的參數
iframeWin.layui.form.render('radio');

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM