Question

当我尝试将事件数据传递给jQuery live函数时遇到了问题。基本上，我有一个生成有许多行的表，每个行数据都被一个对象封装，让我们只调用“tbRow”。我想在每一行上注册一个实时函数，当你点击它时，它会根据行数据采取不同的行为。我构建代码的方式如下：

MYAPP.prototype.actions = function (tbRow) {
   var output = "<div class="select"><a href="#"> Select this row </a></div>"
   $('div.select').live('click', {tbRow: tbRow}, function() {
       console.log(e.data.tbRow.id + "is selected");
       /// do something else
   });
   return output;
};

此函数返回的输出用于构造实际表，同时为该行注册实时函数以响应单击操作。 id的打印（假设每行有一个唯一的ID）仅用于检查我选择的是正确的行。

我遇到的问题是我选择的每一行现在都带有FIRST行的ID，只显示第一行正确注册。我可以想到解决它的一种方法是，使用行ID创建连接字符串，以便：

$('div.select_RowID1").live( .... )

但是，我不确定这是否有效。

提前感谢您的帮助。

奥利弗

Answer 1

我认为你可能正在使用jQuery live，这使得它比必要的更难。你可以这样做：

$('table.live tr').live('click', function(evt){
    console.log($(this));
});

我在这里添加了一个'live'类。这会将click事件绑定到所有当前和所有未来的'tr'元素。 $（this）和evt参数将告诉您单击了哪一行。

这是一个证明这一点的jsfiddle：http://jsfiddle.net/rcravens/yyekt/

希望这有帮助。

鲍勃

Answer 2

您使用直播的方式将导致多个点击事件绑定到每个div.select。您调用该函数的次数各占一个。

试试这个。它使用jQuery index（）函数来检索相对于其他行的行的索引。

$('div.select').live('click',
  function() {   
    console.log( $(this).index() + " is selected");
   /// do something else
});

function makerow(tbRow) {
   var output = '<div class="select"><a href="#"> Select this row </a></div>'

   return output;
};

http://jsfiddle.net/ChrisMH/mLW6R/1/

编辑：更新示例

function makerow(tbRow) {
   var output = '<div id="select' + tbRow.id + '" class="select"><a href="#"> Select this row </a></div>'
   $( "#body" ).append( output );
   $( "div.select#select" + tbRow.id )
       .bind( 'click',
              function() {
                  console.log( tbRow.id );
              }
            );
};

http://jsfiddle.net/ChrisMH/UF4tD/1/

将事件数据传递给jQuery实时处理程序

2 个答案: