Nội dung HTML5Chỉnh sửa với jQuery

Question

Tôi có một số yếu tố cần phải có văn bản bên trong có thể chỉnh sửa, vì điều này tôi đang sử dụng thuộc tính HTML 5 có thể chỉnh sửa được. Tôi dường như không thể sử dụng jQuery cho việc này bằng cách sử dụng nhiều bộ chọn. Những gì tôi muốn làm là có mọi thẻ bên trong div vùng chứa có thể chỉnh sửa được. Dưới đây là ví dụ về việc nó sẽ trông như thế nào nếu nó hoạt động với jQuery:

$("#container <all tags here>").contentEditable = "true"; 

Tôi không biết cách làm cho nó chọn tất cả các thẻ nhưng bạn nhận được điểm.

Vì vậy, tất cả span, div, bảng biểu, đậm, vv nên được chỉnh sửa riêng

Answer 1

$('#container *').attr('contenteditable','true'); 

* có nghĩa là "tất cả các loại nguyên tố", và tương tự như a,div,span,ul,etc...

Giống như hầu hết các chức năng jQuery khác, attr áp dụng cùng một thao tác cho mọi phần tử được chọn bởi bộ chọn.

Answer 2

$("#container *").attr("contentEditable", true) 

Chỉ cần đoán. Ra khỏi máy trạm.

Answer 3

Nếu tôi có thể nhớ chính xác, đặt giá trị contentEditable trên cấp độ gốc cũng sẽ khiến tất cả các con của nó có thể chỉnh sửa được.

Vì vậy, làm điều này:

$('#container').attr("contentEditable", "true"); 

nên làm việc.

Answer 4

tôi nhận được ấn tượng bạn đang hiểu nhầm vấn đề ở hai nơi:

1. jQuery tạo "truy vấn" các đối tượng đó cung cấp một cách viết tắt để thao tác với bộ phần tử DOM. Mã mẫu của bạn đặt contentEditable trên truy vấn chứ không phải nội dung phù hợp. Bạn muốn viết tắt của jQuery để "đặt thuộc tính trên tất cả các phần tử phù hợp", là $('whatever').attr('contentEditable','true');

2. Tôi không chắc bạn hiểu contentEditable đúng cách. Bạn phải đặt nó trên vùng chứa cấp cao nhất cho mỗi vùng có thể chỉnh sửa và các hiệu ứng của nó áp dụng cho mọi thứ bên trong. Theo kinh nghiệm của tôi, nếu thiết lập contentEditable trên #container hoặc một cái gì đó như #container div.post thực sự là không đủ tốt, sau đó bạn đã có vấn đề lớn hơn.

Answer 5

Đối với một số lý do trong IE10 chỉ này dường như làm việc:

$('#container').get(0).contentEditable = "true"; 

Tại sao attr không làm việc tôi không biết.