Câu hỏi jquery tập trung vào nội dung động?


Trong jquery tôi đã nối thêm <li> thành một danh sách không có thứ tự.

Làm thế nào để tôi tập trung vào việc tạo mới <li> ?

Nếu tôi làm như sau:

$("ul").append('<li><input type="text" value="Hi!"></li>');
$("li:last").focus(); //doesn't work because new <li> isn't in dom yet

tiêu điểm không hoạt động, như đã nói ở trên.

Tôi biết jquery 1.4.2 có một live() xử lý sự kiện cho phép bạn tải trình xử lý sự kiện vào các phần tử được thêm động, nhưng tôi không chắc chắn mình đang làm gì sai:

$(document).ready(function () {

    $('li').live('load', function () {
       alert("hi!");
       $("li:last").focus();
    });
 });

7
2018-05-17 09:25


gốc


Các input yếu tố là một TRỐNG phần tử, nó không nên có một thẻ kết thúc. Bạn có thể muốn đặt hi! trong thuộc tính giá trị. - Quentin
@ David, cảm ơn. Đây không phải là mã thực sự, nhưng tôi sẽ sửa nó. - Alan
2500 lượt xem và không phải là một upvote duy nhất. THỜI GIAN TỐT. - Alan


Các câu trả lời:


Bạn chỉ có thể đặt tiêu điểm cho các yếu tố có thể giữ tiêu điểm. Theo mặc định, một mục danh sách không thể. Đây là lý do tại sao ví dụ đầu tiên của bạn không thành công, không phải vì nó không có trong DOM (nó  trong DOM, đó là những gì append làm)

Nói chung, bạn nên sử dụng các yếu tố được thiết kế để giữ tiêu điểm (tức là đặt trọng tâm vào đầu vào chứ không phải mục danh sách). Bạn cũng có thể (nhưng điều này ít tương thích ngược và ít logic hơn) sử dụng HTML5 tabindex (có thể thiết lập nó để 0).

onload sẽ không hoạt động vì các mục danh sách không tải nội dung bên ngoài.


7
2018-05-17 09:28



Cảm ơn. Điều này làm việc. - Alan


Bạn có thể thử điều này, $(YourElement).trigger("focus").


2
2018-05-17 09:36





Đây là một bài viết cũ tôi biết, nhưng một cách đơn giản để giải quyết vấn đề này là tạo một đầu vào văn bản trong HTML của bạn và đặt CSS của nó thành "display: none;". Trên sự kiện nhấp của LI, hãy đặt trọng tâm vào đầu vào này và lắng nghe các sự kiện nhấn phím của nó.

Tôi đã làm nó và nó hoạt động như một sự quyến rũ.


0
2018-03-05 22:11