从输入中检索自定义属性不起作用

Question

我在带有自定义属性的<table>中有一个<input>标签。当我尝试创建一个函数来检索该属性时，它不起作用。有什么想法吗？

<table>
  <tr>
    <td>
      <input row="ab01" id="ab01_01">
    </td>
  </tr>
</table>
function retrieve_row(){
alert($(this).attr('row'));
}

结果是 undefined .为什么？

Answer 1

几件事：

您的this范围不正确，只需直接定位您的元素：

function retrieve_row(){
   alert($('#ab01_01').attr('row'));
}

另外，不要像现在这样创建自定义 HTML 属性。不过，不要害怕，您可以使用HTML5 data-属性来实现相同的目的：

  <input row="ab01" id="ab01_01">  //INVALID
  <input data-row="ab01" id="ab01_01"> //VALID
   function retrieve_row(){
      alert($('#ab01_01').attr('data-row')); //The un-hip way
      alert($('#ab01_01').data('row')); //Like the cool kids are doing
   }

来自jQuery的pappy：http://ejohn.org/blog/html-5-data-attributes/

根据OP的评论，我相信他正在寻找这个：

$("table").on( "click", "input", function() {
     alert($(this).data('row'));
});

您可能希望向表中添加类或 ID，以便此函数不会过于宽泛。