zoukankan      html  css  js  c++  java
  • jquery动态添加Div


     

    html页面中的代码

    <div id="filterDiv">
                <div id="div1">
                     <input id="inputPropertyName1" value="MetricName" />
                     <input id="inputOperation1" value="contains" />
                     <input id="filterValue1" />
                </div>    
           </div>
             <button id="filter">Filter</button>
             <button id="add">Add</button>
             <button id="reset">Reset</button>


    jqury代码

    $("#filter").click(function () {
                        for (var i = 1; i <= filterNum; i++) {
                            if ($("#filterValue" + i).val() == null || $("#filterValue" + i).val() == "") {
                                alert($("#filterValue" + i).val());
                                continue;
                            }
                            else {
                                if ($("#inputPropertyName" + i).val() == "MetricId") {
                                    dataSource.filter({
                                        field: $("#inputPropertyName" + i).val(),
                                        operator: $("#inputOperation" + i).val(),
                                        value: parseInt($("#filterValue" + i).val())
                                    });
                                }
                                else {
                                    dataSource.filter({
                                        field: $("#inputPropertyName" + i).val(),
                                        operator: $("#inputOperation" + i).val(),
                                        value: $("#filterValue" + i).val()
                                    });
                                }
                            }
                        }
     
                    });
     
     
                    $("#add").click(function () {
                        filterNum++;
                        var newDiv = document.createElement('div');
                        var str = "<input id='inputPropertyName" + filterNum + "' value='MetricName' /><input id='inputOperation" + filterNum + "' value='contains' /><input id='filterValue" + filterNum + "' /><input id='delItem'" + filterNum + " onclick='delItem(" + filterNum + ");' value='删除此项' type='button' />";
                        newDiv.innerHTML = str;
                        newDiv.setAttribute("Id", "div" + filterNum);
                        $("#filterDiv").append(newDiv);
                    });
     
     
                    $("#reset").click(function () {
                        dataSource.filter({
                            field: "MetricName",
                            operator: "contains",
                            value: ""
                        });
                    });

    ?

    删除的jquery

    function delItem(i) {
                    $("#div" + i).remove();
                }


    ?

  • 相关阅读:
    Python PEP8 编码规范中文版
    MySQL分区表
    mybatis缓存,包含一级缓存与二级缓存,包括ehcache二级缓存
    斐讯K2刷不死breed与第三方固件教程
    Mysql 多表连接查询 inner join 和 outer join 的使用
    mysql多表关联删除示例
    sublime Text 几款插件
    多进程vs多线程
    git 命令常用总结
    LNK1123: 转换到 COFF 期间失败: 文件无效或损坏
  • 原文地址:https://www.cnblogs.com/fyq891014/p/4188884.html
Copyright © 2011-2022 走看看