2012-12-12 14 views
5

Tôi đang sử dụng một lựa chọn có chọn nhóm cho một số điều hướng trên thiết bị di động. Tôi sử dụng nhãn của nhóm chọn để chỉ ra phần nó thuộc về - và sau đó là tùy chọn để chỉ định phần phụ.Lỗi iOS? Không thể thay đổi văn bản trong một lựa chọn khi được lấy nét bằng cách sử dụng jQuery

Vấn đề là trong hầu hết mọi trình duyệt tôi gặp phải đều không hiển thị nhóm chọn khi chọn không được lấy nét. Tôi đã giải quyết vấn đề này bằng cách viết jQuery sau đây:

$(".Nav-Interior-Mobile select option:selected").each(function() { 
    pageGroupLabel = $(this).parent('optgroup').attr('label'); 
    pageItemLabel = $(this).text(); 
    $(this).text(pageGroupLabel + " > " + pageItemLabel); 
}); 
$('.Nav-Interior-Mobile select').focus(function() { 
    $(this).find('option:selected').text(pageItemLabel); 
}); 
$('.Nav-Interior-Mobile select').blur(function() { 
    $(this).find('option:selected').text(pageGroupLabel + " > " + pageItemLabel); 
}); 

Điều này dường như hoạt động trong mọi thứ trừ iOS. Trong iOS, giao diện người dùng thay đổi lựa chọn không phản ánh văn bản mới được sử dụng trên tiêu điểm. Tôi có thể thấy lựa chọn thực tế phía trên giao diện người dùng của Apple thay đổi - nhưng giao diện người dùng của họ không hề thay đổi.

Bất kỳ ai có ý tưởng về cách thực hiện việc này?

Ở đây nó đang làm việc khi mờ:

http://files.secondstreetmedia.com/support/todd/blurred.PNG

Và không hoạt động khi tập trung (UI của họ vẫn có "Thương hiệu> Web" khi nó chỉ nên nói "Web"):

http://files.secondstreetmedia.com/support/todd/focused-2.jpg


Điều này hoàn toàn phải là lỗi - nếu bạn cuộn xuống và sau đó sao lưu trong danh sách - văn bản sau đó thay đổi - kỳ quái.

+0

Nếu bạn chắc chắn đó là lỗi, tại sao bạn không đăng nhập lỗi tại Apple? – dreamlax

+0

Tôi hy vọng một người nào đó ở đây có giải pháp thay thế hoặc có thể đề xuất giải pháp khác cho vấn đề. –

+0

Ngoài ra tôi đã đăng một lỗi ở đó. –

Trả lời

0

Hãy thử sử dụng các plugin quickChange được đăng ở đây:

Strange behavior of select/dropdown's onchange() JS event when using 'Next' on Mobile Safari Dropdown list item select box

Sau khi dán mã cắm vào tập tin Javascript của bạn, bạn sẽ có thể thay thế mã onfocus của bạn với điều này:

$('.Nav-Interior-Mobile select').quickChange(function() { 
    $(this).find('option:selected').text(pageItemLabel); 
}); 

Và mã onblur hiện tại của bạn sẽ tiếp tục hoạt động để thay đổi giá trị trở lại.

Các vấn đề liên quan