Question

我正在构建一个应用程序，在某个点上生成一个非常大的摘要表（20x~200）。我可以在支持代码中识别的一些单元格（可能是1000）需要某种onclick绑定。需要将这些单元格的值解析为页面上的输入字段。

我调查了内联渲染：onclick = genericfunctioncall（“copy_of_celldata”）不知何故，这对我来说感觉不够现代......：）

因为我正在使用JQuery来处理其他一些东西，所以我想利用它。考虑类绑定和id绑定（必须让我渲染ID，以及大量的绑定）。类绑定是我的首选方式。但是因为我动态地渲染表（Ajax在MVC4中调用partialview并渲染.data），我必须使用.on（“click”，....）方法。我无法找到一种方法来检测我点击哪个TD来确定它的值并将其解析为输入。

有人有想法吗？

Answer 1

为要为其分配点击事件的所有td提供一个公共类。

使用事件委派，因为您要为超过1000个元素绑定相同内容。

在事件中使用this上下文来获取触发事件的td。

$('table').on('click', '.tdClass', function() {
     // this refers to td which triggered the event
});

Answer 2

我对使用jQuery.data（）非常满意。您可以将任何想要的东西绑定到DOM元素。如果你的服务器有JSON响应，那么这就是使用它的一个例子：

$.get('/url',function(resp){
   $.each(resp,function(k,v){
       // v is json object {"name":"item name","id": 22, "link": "http://www.google.com"}
       var item = $('<li />');
       item.html(v.name);
       item.data('item',v);  //attach your json object to dom element.

       $('ul').append(item);
   });
});
$('ul').on('click','li',function(){
      var data = $(this).data('item') // get your original object 
      alert(data.link) -->> "http://www.google.com"
      // do whatever you need to do.
});

大量的onclick元素......或者也许是一些jquery

2 个答案: