2010-10-04 32 views
6

Tôi có một lỗi lạ, tốt, MSIE làm.Lỗi hộp nhập liệu chỉ đọc trong Internet Explorer

Có vẻ nó đang thất bại trên tất cả các phiên bản MSIE chính: (!) 6, 7, 8 và 9

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb" lang="en-gb" ><head><title>test</title> 

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript"> 
    jQuery(document).ready(function(){ 
    var test=jQuery('#in'); 
    test.focus(function(){ 
    if(test.val()=='empty')test.val(''); 
    test.attr('readonly',false); 
    }); 
    test.blur(function(){ 
    if(test.val()=='')test.val('empty'); 
    test.attr('readonly',true); 
    }); 
    }); 
    </script> 

</head><body> 

    <input type="text" value="empty" readonly="readonly" id="in"/> 

</body></html> 

Hãy để tôi giải thích như thế nào hệ thống này làm việc và những gì đang xảy ra sai.

Khi người dùng nhấp (tập trung) hộp nhập, hộp nhập liệu sẽ được thực hiện có thể chỉnh sửa (tức là mất cờ chỉ đọc). Sau đó, khi s/ông rời khỏi hộp đầu vào (ví dụ, sự kiện mờ) một số xử lý được thực hiện (không được hiển thị trong mã) và hộp đầu vào được thực hiện chỉ đọc.

Điều này hoạt động như một nét duyên dáng trong hầu hết các trình duyệt (firefox, opera, dựa trên webkit), nhưng không phải bất kỳ phiên bản nào của IE (bao gồm cả 9 beta). Vấn đề là trong IE, người dùng phải bấm vào hộp nhập liệu hai lần.

Tại thời điểm này, bạn có thể yêu cầu hộp nhập liệu được đọc lại lần đầu tiên? No. Tôi đã thử nghiệm nó, javascript báo cáo rằng nó có thể chỉnh sửa được.

Sửa lỗi dễ dàng, chỉ cần kích hoạt sự kiện nhấp chuột vào hộp nhập liệu (để mô phỏng hành vi nhấp đúp của người dùng), không? Không, .click().focus() cả hai đều không thành công. Không biết tại sao.

Chỉnh sửa: Biết con trỏ hiển thị trong hộp văn bản, ít nhất là rõ ràng.

Quan trọng: Mọi người, vui lòng thử ít nhất là thử mã trước khi trả lời!

+6

Tại sao làm cho nó chỉ đọc ở tất cả, nếu một nhấp chuột làm cho nó có thể chỉnh sửa? –

+1

Đó không phải là một sửa chữa, hoặc một câu trả lời mang tính xây dựng, lúc đó. – Christian

+0

Đó là lý do tại sao nó là một bình luận và không phải là một câu trả lời. – meagar

Trả lời

8

Tôi sẽ không nói đó là lỗi. Nếu bạn thay đổi giá trị, bạn cũng loại bỏ textRange hiện tại.

Hãy thử test.select(), nó sẽ đưa con trỏ trở lại đầu vào.

test.focus() 

sẽ dẫn đến vòng lặp kết thúc trong "bộ nhớ không đủ".

+0

Xin chào! Tôi sẽ thử cái đó càng sớm càng tốt. Tuy nhiên, tôi đã sử dụng .focus() thành công, như trong, tôi đã không nhận được một lỗi như vậy. Nhưng như tôi đã nói, nó không hoạt động. Ồ, điều này quan trọng, biết rằng con trỏ thực sự nằm trong hộp nhập liệu, ít nhất là rõ ràng. (câu hỏi đã chỉnh sửa) – Christian

+0

Hmm, nó hoạt động tốt! – Christian

+0

'test.select()' đã khắc phục sự cố! nhưng 'test.focus()' thì không. – eloone

2

Tôi tin rằng readonly phải là readOnly. Có vẻ lạ bạn sẽ chuyển đổi tài sản này. Bạn cũng có thể thử để xoá bỏ nó

jQuery("#foo").removeAttr("readOnly"); //.removeAttr("readonly"); 
+0

uhm? Đó là "chỉ đọc" MSIE dường như thay đổi nó thành "readOnly", nhưng nó cũng hoạt động tốt. Bên cạnh đó, đó là quá khứ vấn đề của tôi. – Christian

1

thử ive này chỉ cố gắng đó và nó hoạt động:

<input type="text" value="empty" id="in" readonly/> 
Các vấn đề liên quan