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 + " οnclick='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();
            }


?

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值