0

当用户在表中单击按钮时，我正在使用 JQuery 显示隐藏的“元素”（使用 css 隐藏 ---> display:none）。我正在使用 Rails、Ruby、JQuery 和 HTML。

查看代码：

     <h2>Files</h2>
<table class="table">
<tr>
<th>Filename</th>
<th>Description</th>
<th>Download Link</th>
</tr>
      <% @files.each do |file| %>
      <% filename = file.split('/').last %>
      <% object = @bucket.objects[file] %>

    <tr>         
      <td><%= filename %></td>  

      <td>
      <div class="file_description"><%= object.metadata['description']%>    
        <button id     ="file3" type="button"  class= "btn btn-default   
          edit_description"   onclick="Window(this)">Edit</button>                      
     </div>
         <div id = file2 class="file_description_update" >
          <%= form_tag({:action => 'update_file_info'}, multipart: true) do %> 
            Update File Description: <%= text_area_tag :description %>
            <%= hidden_field_tag :s3_path, file %>  
            <%= hidden_field_tag :prefix, @prefix %>
            <%= submit_tag 'Submit' %> </td> <br />
          <% end %>
        </div>


      </td> 

      <td><%= link_to "Download", download_url_for(file) %></td>

    </tr>
  <% end %>
  </table>

当前的 JQuery 代码（在单击任何单个按钮时显示所有隐藏的“td”元素，其中包含嵌入的 ruby​​ 中的 form_tag）：

    $(document).ready(function(){ 
    $( "button.edit_description" ).on( "click", function( event ) { 
    $( "div.file_description_update" ).show(); 
    }); 
    });

如上所示，我的显示代码在一个 ruby​​ for 循环中，现在，当我单击任何按钮时，使用我现有的 Jquery 代码，所有隐藏的 'td' 元素都会显示给所有按钮 --- 我的需要是我希望它只为相应的单个按钮显示相应的隐藏“td”元素。我不确定如何在 HTML 中使用属性或在 Jquery 中为此做一些事情。

有人可以用代码指导我吗？谢谢

4

1 回答 1

1

你需要一些jQuery DOM 遍历方法this。

this= 您单击的元素，您的代码应如下所示：

$(document).ready(function(){ 
    $( "button.edit_description" ).on( "click", function( event ) { 
        $(this).closest('td').find( "div.file_description_update" ).show(); 
    }); 
});
于 2013-09-04T01:59:59.840 回答