2013-06-25 40 views
6

Tôi có nhiều hộp mở rộng/thu gọn trên một trang được tạo bởi PHP/MySQL.Mở rộng/thu gọn divs

Vấn đề là khi tôi nhấp vào một liên kết để mở rộng hộp, nó sẽ mở rộng tất cả các hộp.

Tôi nghĩ về việc thêm ID bài đăng vào cuối lớp (<div class="postreplycontainer-POST_ID">) nhưng tôi không chắc liệu điều đó có hiệu quả hay không vì tôi phải tìm ra cách để thay đổi jQuery.

Dưới đây là một ví dụ làm việc: http://jsfiddle.net/Draven/kUhkP/35/

Hãy ghi nhớ, tôi không thể tự mã trong mỗi hộp bởi vì tôi đang kéo nội dung từ cơ sở dữ liệu.

EDIT: Có thể ai đó có thể giúp tôi giải quyết thêm sự cố.

Tôi muốn tập trung vào ô textarea khi mở rộng <div>. Tôi đã thử sử dụng cùng một mẹo như trước đây (sử dụng .closest nhưng điều đó không hiệu quả).

Dưới đây là ví dụ: http://jsfiddle.net/Draven/kUhkP/53/

Ví dụ này sẽ luôn luôn tập trung <textarea> đầu tiên.

+1

Cảm ơn mọi người đã trả lời! Họ đều làm việc nhưng tôi đã chọn câu trả lời mà không dựa vào bất kỳ bảng nào sau div. – Draven

Trả lời

9

Đây là FIDDLE

$("a.postreply").click(function() { 
    $(this).closest('.blog-container') 
     .find('.postreplycontainer').slideToggle("fast"); 
}); 
0

Nếu bạn gọi $("div.postreplycontainer") bạn sẽ truy cập vào tất cả các div, nếu div luôn là sau khi một bảng, bạn có thể sử dụng

$("a.postreply").click(function() { 
    $(this).parents('table').next().slideToggle("fast"); 
}); 

trượt mà div http://jsfiddle.net/kUhkP/39/

0

Tôi nghĩ điều này sẽ ổn cho vấn đề của bạn.

$("a.postreply").click(function() { 
    $(this).closest('.blog-table').next().slideToggle("fast"); 
}); 
Các vấn đề liên quan