2

在每一行中都有一个文本框和一个按钮，我想通过它们各自的文本框单击按钮来获取文本数据。但问题是我为每个按钮单击获得相同的值，因为 textboxID 是相同的......在循环中我的代码就是这样......有没有办法获取每个文本框的值以进行 diff 按钮单击

 <% @obj.each_with_index do |time_sheet, i| %>
   <tr>
     <td style="width:30px;"><input type="text" name="comment"  id='commentId'></td>
     <td class="table-styling"> <button type="button" id="waiver">Waiver</button></td>
   </tr>
  <% end %>


  $('#waiver').live("click", function() {
 var commentVal = $("#commentId").val();
 alert(commentVal); //getting same value for each button click

   });
4

3 回答 3

3 
$(document).on('click', '#waiver', function() {
   var commentVal = $(this).closest('tr').find("#commentId").val();
   console.log(commentVal);
});

当然，ID 是唯一的，看起来您正在循环内批量生产具有相同 ID 的元素，这不是一个好主意，并且会使 javascript 变得 boo-boo。

于 2012-12-14T08:48:08.690 回答
3

您正在创建大量具有相同id属性的元素。该id属性用于标识一个元素。不再。

改用一个类：

<% @obj.each_with_index do |time_sheet, i| %>
    <tr>
        <td style="width: 30px;">
            <input type="text" name="comment" class="comment" />
        </td>

        <td class="table-styling">
            <button type="button" class="waiver">Waiver</button>
        </td>
    </tr>
<% end %>

还有你的 JS：

$(document).on('click', '.waiver', function() {
    var commentVal = $(this).closest('tr').find('.comment').val();
});
于 2012-12-14T08:48:47.523 回答
3

首先重要的是 ID 应该是唯一的！

如果要获取相应的文本框值，可以尝试将代码替换为类名而不是下面显示的 id

<% @obj.each_with_index do |time_sheet, i| %>
 <tr>
 <td style="width:30px;">
   <input type="text" name="comment"  class='comment-textbox'>    </td>
 <td class="table-styling"> 
   <button type="button" class="btn-waiver">Waiver</button></td>
 </tr>

 $('.btn-waiver').live("click", function() {
 var commentVal =$(this).closest('tr').find('.comment-textbox').val();
     //or
 var commentVal = $(this).parents('tr:first').find('.comment-textbox').val();
 alert(commentVal); //getting same value for each button click

 });
于 2012-12-14T08:50:18.933 回答