jQuery动态添加dom以及添加事件

2016-03-09

jQuery动态添加dom以及添加事件

动态添加dom以及添加事件取当前点击行的数据

1	<ul class='uList_a'></ul>

//动态生成li
for(var i=0;i<res.length;i++){
  var li = ("<li><span>"+res[i].title+"</span><span >"+res[i].status+"</span><span class='xq'>详情</span></li>")
  $(".uList_a").append(li);
}
//添加事件点击详情
$('.uList_a li').each(function(index,item){
    var dialogTitle = res[index].title;//当前点击的下标对应数组的数据
    $(this).find('.xq').click(function () {
        console(index,item)
    })
})

js动态添加dom及事件获取当前点击行的数据

1	<ul class='sendedGz'></ul>

$.ajax({
	type : 'get',
	url : '/Platform/salarypaylog/salaryPaymentStatus.do',
	success : function(data) {
		var sended = data.sended;
		for(var i=0;i<sended.length;i++){
        	$('.sendedGz').append('<li  title="'+sended[i].bumenmc+'">'+sended[i].bumenmc+'</li>');
        }
        var ulList_1 = document.querySelectorAll(".sendedGz li");
        ulList1(ulList_1,sended);
	}
})

function ulList1(dom,data){
    var ulList1 = dom;
    for (var i = 0; i < ulList1.length; i++) {
        ulList1[i].index = i;
		ulList1[i].onclick = function(e){
		    console.log(data[this.index].bumenmc)
		}
    }

}