nút traverse từ khoảng để span

Question

Tôi mới học jQuery và kịch bản java, hiện tôi đang phải đối mặt với một vấn đề trong hiển thị nút ẩn, html của tôi là

<span style="float:left;padding-right:10px"> 
    <input type="button" value="image" class="delete" /> 
    <a href="/media/image"><img src="/media/image" /></a> 
</span> 
<span style="float: left; padding-top: 5px;"> 
    <a href="/media/image"> 
     <button type="submit" class="delete_media">Delete</button> 
    </a> 
</span> 

Jquery:

$(".delete").click(function(){   
var $this = $(this); 
$this.siblings(".delete_media").toggle();    
}); 

css :

.delete_media {  
    display:none; 
    float: right; 
    height: 25px; 
    width: 60px; 
    -moz-border-radius: 10px; 
    border-radius:10px;  
} 

Ngoài ra tôi đã thử sử dụng tìm, tiếp theoTất cả, gần nhất cũng không có tác dụng nào để thực hiện công việc này.

Demo Here

Answer 1

Hãy thử điều này

$this.closest('span').next().find(".delete_media").toggle(); 

DEMO

Answer 2

Bạn đang sử dụng anh chị em nhưng chúng không có cùng một nơi chứa. Chức năng duyệt ngang khác cũng không thực hiện được công việc vì hai nút này không có vùng chứa chung.

Chỉ cần tìm kiếm nó bằng lớp

$(".delete").click(function(){   
    var $this = $(this); 
    $(".delete_media").toggle();    
}); 

Đó là khuyến khích rằng bạn sẽ quấn hai nút với một container thông thường.

Dưới đây là một ví dụ

<div data-action="delete"> 
    <span style="float:left;padding-right:10px"> 
     <input type="button" value="image" class="delete" /> 
     <a href="/media/image"><img src="/media/image" /></a> 
    </span> 
    <span style="float: left; padding-top: 5px;"> 
     <a href="/media/image"> 
      <button type="submit" class="delete_media">Delete</button> 
     </a> 
    </span> 
</div> 

$(".delete").click(function(){   
    var $this = $(this); 
    $this.closest("div[data-action='delete']") 
          .find(".delete_media").toggle();    
});