动态绑定值以双击

时间:2014-05-28 06:52:04

标签: javascript jquery

我正在使用JQuery和javascript创建一个表。我也成功地为每一行绑定方法但是当我尝试绑定dblclick事件时,它总是使用最后一行的值(在这种情况下是列表中的最后一个客户) ):

            for (var i = 0; i < customers.length; i++) {
                var newRow = $("<tr><td></td><td></td><td></td><td></td><td></td><td></td></tr>");
                newRow.attr('onmouseover', 'rowMouseOver_Popup(' + i + ');');
                newRow.attr('onmouseout', 'rowMouseOut_Popup(' + i + ');');
                newRow.attr('onclick', 'rowSelect_Popup(' + i + ');');
                //above is working fine                    

                //below (adding the dblclick) doesn't work
                newRow.dblclick(function () {
                    selectCustomer(customers[i].Cust_Code,  customers[i].Cust_Name);
                });

                newRow.appendTo(tbl);
                }

我尝试了下面的一些变化,但没有这样的运气:

newRow.on('dblclick', 'selectCustomer(\'' + customers[i].Cust_Code + '\'' + ',' + '\'' + customers[i].Cust_Name + '\');');

newRow.attr('dblclick', 'selectCustomer(' + customers[i].Cust_Code + '\'' + ',' + '\'' + customers[i].Cust_Name + '\');');

我想这是函数调用的范围或上下文,我不明白,如果你可以添加一个链接到你的答案,所以我可以了解更多关于问题/解决方案我会非常感激。< / p>

提前致谢

3 个答案:

答案 0 :(得分:1)

你的问题是你在每个i上重置处理程序,所以监听器在循环结束时将最后一个作为参数。

使用ondblclick,因为您已经使用了内联事件处理程序:

var code = customers[i].Cust_Code,
    name = customers[i].Cust_Name;
newRow.attr('ondblclick', 'selectCustomer(' + code + ','  +  name + ')');

在您的情况下,您可以使用委托侦听器:

 for (var i = 0; i < customers.length; i++) {
            var newRow = $("<tr><td></td><td></td><td></td><td></td><td></td><td></td></tr>");
            newRow.attr('index', i);
            newRow.appendTo(tbl);
 }

现在使用jquery设置侦听器:

 $('tr[index]').on('click',rowSelect_Popup($(this).attr('index')))
 .on('onmouseover',rowMouseOver_Popup($(this).attr('index')))
 .on('onmouseout',rowMouseOut_Popup($(this).attr('index')))
 .on('ondblclick',function() { 

 var i = $(this).attr('index'),
     code = customers[i].Cust_Code,
     name = customers[i].Cust_Name;

 selectCustomer(code,name);
 })

根据我的经验,最好使用mouseenter和mouseleave事件而不是mouseover和mouseout。但这取决于你。

答案 1 :(得分:1)

我认为这更好。

/**
 * In this case using on is much better.
 * check this:
 * http://api.jquery.com/on/
 */
newRow.on("dblclick", {Cust_Code: customers[i].Cust_Code,
                       Cust_Name: customers[i].Cust_Name}, function(event) {
    selectCustomer(event.data.Cust_Code,  event.data.Cust_Name);
});

答案 2 :(得分:0)

试试这个。

newRow.ondblclick=function(){ SomeJavaScriptCode };