动态ASP.NET GridView中jQuery选中单元格无法获取html()值

哦，我一眼就发现你代码里的关键问题了！你写的$('this')是错误的用法——this是JavaScript的内置关键字，不需要用引号包裹起来。加了引号之后，jQuery会去寻找页面中标签名为<this>的元素，显然找不到，所以返回undefined。

第一步：修正核心错误 #

把$('this')改成$(this)，这样才能正确指向当前被点击的<td>元素：

$('#dgrMainGrid td:nth-child(1)').click(function() { 
    var barCode = $(this).html(); 
    alert(barCode); 
});

第二步：处理动态生成的GridView的事件绑定问题 #

因为你的GridView是动态创建的，可能在页面初始加载完成后才被渲染到DOM中。这时候直接绑定click事件可能会失效，建议用事件委托来解决，把事件监听绑定到一个已经存在的父元素（比如document或者GridView的直接父容器）上：

$(document).on('click', '#dgrMainGrid td:nth-child(1)', function() {
    var barCode = $(this).html();
    alert(barCode);
});

事件委托的原理是利用事件冒泡机制，父元素会监听所有子元素触发的点击事件，哪怕子元素是后续动态生成的也能生效。

第三步：确认GridView的客户端ID是否正确 #

ASP.NET WebForms的控件（包括GridView）默认会生成带命名容器前缀的客户端ID（比如ctl00_ContentPlaceHolder1_dgrMainGrid），这会导致你的#dgrMainGrid选择器找不到元素。可以通过两种方式解决：

• 在GridView控件上设置ClientIDMode="Static"，这样客户端ID就会和服务器端ID保持一致：

  <asp:GridView ID="dgrMainGrid" ClientIDMode="Static" ... />
  

• 用属性选择器匹配包含目标ID的元素：

  $('[id*="dgrMainGrid"] td:nth-child(1)').click(function() {
      var barCode = $(this).html();
      alert(barCode);
  });
  

按照上面的步骤调整后，应该就能正常获取到点击单元格的内容了！

内容的提问来源于stack exchange，提问作者buckshot