'tiếp theo' trong trình đơn thả xuống trên iPhone Safari không kích hoạt trên sự kiện thay đổi

Question

Tôi đang cố gắng thực hiện thả xuống xếp thẳng về phía trước cho safari di động. Tôi đã làm việc này 100% trong safari chính nó, trong đó cho thấy phong cách bình thường thả xuống. Nhưng danh sách thả xuống safari di động có nút 'tiếp theo'.

Nhấn nút tiếp theo này sẽ đưa bạn đến danh sách thả xuống tiếp theo trong dòng thác với kích hoạt onchange() - do đó danh sách thả xuống tiếp theo trống.

Người dùng buộc phải nhấn 'xong' để kích hoạt khi thay đổi, sau đó nhấp vào menu thả xuống tiếp theo.

Có ai biết cách này không. Hoặc sự kiện DOM nào được kích hoạt bởi safari''next 'trên thiết bị di động?

Answer 1

Đó là lớp phủ gốc iOS, vì vậy những gì bạn sẽ nhận được là sự kiện mờ khi lớp phủ đó xuất hiện. Hãy thử sử dụng sự kiện làm mờ và xem cách hoạt động.

Answer 2

Tôi đã thử nhiều giải pháp trực tiếp để giải quyết vấn đề này mà không thành công. Bản kéo thứ hai được điền sau Lớp phủ "trợ lý biểu mẫu" của Safari Mobile đi kèm với trình quay (được gọi là "bộ chọn" trong tài liệu - http://developer.apple.com/library/ios/#DOCUMENTATION/UserExperience/Conceptual/MobileHIG/UIElementGuidelines/UIElementGuidelines.html), xuất hiện. Vì vậy, bộ chọn được điền bằng các giá trị cũ.

Trong trường hợp khác, nếu tầng thứ hai kéo xuống không hoạt động, nút Tiếp theo của trợ lý biểu mẫu bỏ qua ngay trên đó. Tuy nhiên, trong kịch bản đó, khi phần tử biểu mẫu sau được hạ cánh, bản kéo xuống thứ hai sẽ tự cập nhật chính xác, do đó, nhấn vào "trước đó" tại điểm đó sẽ cung cấp danh sách chính xác trong bộ chọn.

"Câu trả lời" của tôi là Apple đề xuất rằng nền tảng xếp tầng dựa trên JavaScript không nên được sử dụng nhưng một UX khác sẽ được triển khai mặc dù tôi không tìm thấy gì mô tả điều này ngoài các trình đơn phân trang loại jQuery Mobile chuẩn.

Answer 3

Vô hiệu hóa menu thả xuống thứ hai từ đầu là công việc duy nhất xung quanh tôi đã tìm thấy cho đến nay! nó sẽ vô hiệu hóa nút "tiếp theo" trên iphones

Thêm attr bị vô hiệu hóa (disabled = "disabled") để bạn chọn và sử dụng javascript hoặc jQuery để bật hoặc tắt.

đây là mã jQuery

$(".DD1").focus(function() { 
    $('.DD2').attr('disabled', 'disabled'); 
}).blur(function() { 
    $('.DD2').removeAttr('disabled'); 
}); 

đây là một ví dụ sống được làm điều này

sử dụng jQuery: http://www.imotors.com/mobile