Tự động hoàn thành jQuery: Chọn sự kiện

Question

Tôi đang cố gắng gửi biểu mẫu khi một mục được chọn từ trình đơn. Tôi đặt lớp học trên biểu mẫu tìm kiếm và tôi đang sử dụng sự kiện để chọn nó ở đây: http://docs.jquery.com/UI/Autocomplete#event-select

Bây giờ, khi bạn chọn một mục bằng bàn phím (LÊN và Xuống), nó hoạt động. Nhưng nếu bạn chọn một mục bằng chuột, nó sẽ cung cấp cho bạn giá trị đã được nhập trước đó.

Kiểm tra screenr này: http://www.screenr.com/7T0s

Đây là những gì tôi sử dụng cho trình:

$("#searchform-input").autocomplete({ 
    select: function (a, b) { 
     $(".searchform1").submit() 
    } 
}); 

Answer 1

Điều này là do hành vi mặc định select sự kiện được thực hiện after your event handler is finished running (để bạn có thể hủy bỏ nó nếu bạn lựa chọn).

Điều này có nghĩa là khi bạn nhấp vào nội dung nào đó, biểu mẫu của bạn được gửi trước khi tiện ích con có cơ hội điền chính xác input.

Bạn sẽ có thể khắc phục điều này bằng cách thực hiện những gì widget thường làm cho bạn:

$("#searchform-input").autocomplete({ 
    select: function (a, b) { 
     $(this).val(b.item.value); 
     $(".searchform1").submit() 
    } 
}); 

Bây giờ, những gì bạn có thể tự hỏi là có, nhưng tại sao nó hoạt động khi tôi sử dụng bàn phím?

Điều này xảy ra vì sự kiện focus thực sự điền mục được tập trung vào input (xem kỹ; bạn sẽ thấy số input được điền khi bạn di chuyển lên và xuống danh sách). Khi bạn di chuyển một mục, sự kiện focus được gọi, điền vào số input. Khi bạn chọn một cái gì đó bằng cách sử dụng phím enter, giá trị chính xác sẽ xảy ra trong input vì sự kiện focus.

Answer 2

Hehe. Khá khó khăn này, nhưng vô cùng đơn giản để giải quyết. Chỉ cần trì hoãn chức năng 500 mili giây, sau sự kiện chọn. Nó hoạt động hoàn hảo. CÔNG VIỆC HOÀN THÀNH!! :)

$("#searchform-input").autocomplete({ 
select: function (a, b) { 
    setTimeout(submit,500); 
}});