• Jeasyui 动态添加元素的方法


    我在做项目的过程中自己写了一些动态添加元素的方法

    HTML代码部分

     1 <ul class="contentul">
     2                         <li class="all_li">
     3                             <input type="text" name="Email_0" data-options="required:true,validType:'email'" class="easyui-validatebox inputstyle in1" />
     4                             <input type="text" name="FullName_0" data-options="required:true,validType:'CHS'" class="easyui-validatebox inputstyle in2" />
     5                             <input type="text" name="QQ_0" data-options="required:true,validType:'number'" class="easyui-validatebox inputstyle inqq" />
     6                             <input type="text" name="MobilePhone_0" data-options="required:true,validType:'mobile'" class="easyui-validatebox inputstyle in3" />
     7                             <img src="/Theme/NewBlueVacation/Images/anniu_duding_false.png" class="add_img" />
     8                         </li>
     9 </ul>
    10 
    11 <div class="_buttom_check">
    12                         <table>
    13                             <tr>
    14                                 <td style=" 60%;"></td>
    15                                 <td class="_buttom A" style="color:#0f8ca3; auto"><a href="#">+增加一个账号</a></td>
    16                                 <td class="_buttom B"><a href="#" id="addbma"><img src="/Theme/NewBlueVacation/Images/3-5_anniu_queding.png" /></a></td>
    17                                 <td class="_buttom _C"><a href="#" id="cancel"><img src="/Theme/NewBlueVacation/Images/3-6_anniu_qudiao.png" /></a></td>
    18                                 @*<td class="_buttom _D"><a href="#"><img src="/Theme/NewBlueVacation/Images/3-7_anniu_daoru.png" /></a></td>*@
    19                             </tr>
    20                         </table>
    21  </div>
    页面代码

    javascript代码

    <script>
    //弹出对话框的方法
    window.onload = function () {
            if ("@ViewBag.Msg2" != "") {
                alert("@ViewBag.Msg2");
            }
    //checkbox检测所有的是否为选 中状态
     $('._ninput input[type=checkbox]').click(function () {
                    var cc = $('._ninput input[type=checkbox]');
                    var truelenght = 0;
                    cc.each(function (index) {
                        if (cc.eq(index).prop('checked'))
                        {
                            truelenght++;
                        }
                    })
    
                    if (truelenght == cc.length) {
                        $('.table1 .A').find('input[type=checkbox]').prop('checked', true);
                    }
                    else {
                        $('.table1 .A').find('input[type=checkbox]').prop('checked', false);
                    }
                });
    
    
    //添加一行
    $('.table2 .A').click(function () {
                    $('.table2 ._buttom_check').before($('.table2 .contentul').first().clone(true, true));
                    $('.table2 .contentul').slice(-1).find('input[type=text]').val("");
                    var ma = $('.table2 .contentul').size();
                    $.parser.parse($('.table2 .contentul')); //此行很重要,主要是添加jeasyui的功能
                    $('#hang').val(ma);
                    for (var i = 0; i < ma; i++) {
                        $.each($('.table2 .contentul'), function (index, value) {
                            if (index == i) {
                                $('.table2 .contentul').eq(index).find('li input[type=text]:eq(0)').attr('name', 'Email_' + i);
                                $('.table2 .contentul').eq(index).find('li input[type=text]:eq(1)').attr('name', 'FullName_' + i);
                                $('.table2 .contentul').eq(index).find('li input[type=text]:eq(2)').attr('name', 'QQ_' + i);
                                $('.table2 .contentul').eq(index).find('li input[type=text]:eq(3)').attr('name', 'MobilePhone_' + i);
                            }
                        });
                    }
    
                });
    
                //删除一行
                $('ul img').click(function () {
                    if ($('.table2 .contentul').size() > 1) {
                        $(this).parents("ul").remove();
                        var ma = $('.table2 .contentul').size();
                        $('#hang').val(ma);
                        for (var i = 0; i < ma; i++) {
                            $.each($('.table2 .contentul'), function (index, value) {
                                if (index == i) {
                                    $('.table2 .contentul').eq(index).find('li input[type=text]:eq(0)').attr('name', 'Email_' + i);
                                    $('.table2 .contentul').eq(index).find('li input[type=text]:eq(1)').attr('name', 'FullName_' + i);
                                    $('.table2 .contentul').eq(index).find('li input[type=text]:eq(2)').attr('name', 'QQ_' + i);
                                    $('.table2 .contentul').eq(index).find('li input[type=text]:eq(3)').attr('name', 'MobilePhone_' + i);
                                }
                            });
                        }
                    }
                });
    </script>
    javaScript代码
  • 相关阅读:
    SAS-决策树模型
    sas 9.4 sid 64bit 到期时间210804 带有EM
    PROC IMPORT 选项
    删除文件夹下各级子目录中的.svn文件
    SAS PROC PRINT 常用选项和语句说明
    SAS 评分卡开发模型变量统计及输出
    Symbol类型是不可枚举的
    将类设置为等于其他类/函数构造函数
    js原生方法promise的实现
    或与非优先级
  • 原文地址:https://www.cnblogs.com/bolanbujing/p/4289803.html
Copyright © 2020-2023  润新知