Question

这是表格http://jsfiddle.net/djochw6L/1/ 当我在项目列

中输入值时，该事件应该触发

$(document).on('change', '.item', function() {
    var ite = $(this).closest('tr');
    getdetails(ite);
})//event

function getdetails(dat){
    var itemName = $(dat).find('.item').val();
    alert (itemName);    
};

事件处理程序对第一行的工作正确。但从第二排起，它会发射两次。这是为什么？

Answer 1

它两次触发的原因是因为你的on change元素为每个具有名称项的类触发。如果查看代码，您可以看到，除了为每个表列提供类项之外，您还将项类传递给添加的每一行。因此事件会触发两次，一次为行，一次为项目列。

提供问题的代码是

prot.attr("class", "item-" + id)

尝试通过不将项类传递给表行来解决问题，而不是向事件侦听器执行各种hacky内容。

您可以将代码构建为

的代码

var grid = Ext.create('Ext.grid.Panel', {
    width: width,
    height: height,
    //frame: true,
    cls: 'gridPadding, x-panel gridPadding x-grid-with-row-lines x-panel-default-framed x-grid',
    id: 'dashboardSearchGrid_' + DivId,
    renderTo: DivId,
    buffered: true,
    store: store,
    plugins: [
        Ext.create('Ext.ux.grid.plugin.GroupingPanel')
    ],
    features: [{
        ftype: 'summary',
        dock: 'bottom'
    }]
});

Answer 2

尝试添加return false：

$(document).on('change', '.item', function () {
    var ite = $(this).closest('tr');
    getdetails(ite);
    return false;
}) //event

jQuery onChange事件处理程序触发函数两次

2 个答案: