2011-07-07 30 views
7

Tôi đang xây dựng một trò chơi JavaScript nơi phát âm thanh và dựa trên âm thanh mà bạn cho rằng phải nhập một số văn bản vào một hộp văn bản lớn. JavaScript được sử dụng để chấm điểm câu trả lời của bạn và sau đó xóa hộp văn bản để chuẩn bị cho đoạn âm thanh tiếp theo.Làm cách nào để hủy hiệu ứng của nút Escape trên đầu vào html?

Sự cố: Trong một số trường hợp khi nhấn phím esc (thoát) trong khi tập trung trong một ô trống <input type="text" />, hộp văn bản được điền bằng một số văn bản cũ.

Tôi đang sử dụng MooTools và đã thử sử dụng event.stop() (dừng phát và cũng thực thi preventDefault) trong khi nhấn phím, nhấn phím và không có may mắn.

Làm cách nào để ngăn nút [esc] thay đổi giá trị trong hộp văn bản?

(Điều này rất quan trọng vì tôi đang sử dụng [esc] làm phím tắt bàn phím để phát lại âm thanh)

+0

Có vẻ như vấn đề là ở nơi khác. Hủy bỏ esc có thể không giúp đỡ. – Mrchief

+0

Lưu ý: Tôi nhận thấy sự cố này trong Firefox 5 – philfreo

+0

Xem [câu trả lời này] (http://stackoverflow.com/a/10275286/2131505). Thêm trình xử lý khóa xuống để ngăn tác vụ mặc định giải quyết vấn đề này theo cách tốt hơn. – Chen

Trả lời

4

Tôi đã có thể khắc phục điều này bằng cách chỉ cần gọi blur() và sau đó focus() trên hộp nhập liệu. Điều đó đã giải quyết vấn đề trong Firefox cho tôi ít nhất.

2

vấn đề Thú vị - nó sẽ xảy ra trong IE ví dụ nhưng không phải Chrome. Đây là một giải pháp mà tôi đã thử nghiệm trong Chrome và IE (có vẻ như nó hoạt động).

được mở rộng phiên bản:

Script trong tiêu đề trang:

<script> 
var buff; //Must have global scope 
var input = document.getElementById("testinput"); //Defined here to save cpu (instead of on every key press). 
function CheckPreBuff(e) 
{ 
    var ev = window.event ? event : e; //Get the event object for IE or FF 

    var unicode = (typeof(ev.keyCode) != "undefined")? ev.keyCode : ev.charCode; 
    if(unicode != 27) buff = input.value; //The 'escape' key has a unicode value of 27 
    else input.value = buff; //Only set the input contents when needed, so not to waste cpu. 
} 
</script> 

đâu testinput 'là đầu vào chúng ta đang vô hiệu hóa thoát trên. Html testinput là dưới đây:

<input id="testinput" onkeypress="CheckPreBuff();" onkeyup="CheckPreBuff();" type="text"/> 

Thông báo cả 'onkeyup' và 'onkeypress' đã được sử dụng - kỹ thuật chỉ 'onkeyup' là cần thiết, mặc dù sử dụng 'onkeypress' ngăn hộp văn bản sẽ trống trong giây lát trong khi phím thoát là suy sụp.

đầu vào Manually minified + ngăn ngừa lỗi + nhiều hỗ trợ (nếu bạn thích)

Script trong tiêu đề:

<script> 
var buff = []; 
function InitCPB(obj){if(typeof(obj)=="undefined")return;buff[0]=obj;buff[1]="";obj.onkeypress=CPB;obj.onkeyup=CPB;} 
function CPB(e){if(typeof((buff[0]))=="undefined")return;var ev=window.event?event:e;(((typeof(ev.keyCode)!="undefined")?ev.keyCode:ev.charCode)!=27)?buff[1]=(buff[0]).value:(buff[0]).value=buff[1];} 
</script> 

thẻ testinput html (mặc dù một id không còn cần thiết):

<input onfocus="InitCPB(this);" type="text"/> 

Cả hai phương pháp đều giữ một bản sao nội dung văn bản được chứa trước khi nhấn phím tiếp theo, nếu đặt khóa chính d đã được 'thoát', unicode 27, sau đó nhập văn bản trước đó đã được đưa trở lại vào hộp văn bản (điều này là phân biệt đối xử để kịch bản không thêm quá nhiều tải cho trình duyệt trên mỗi phím bấm).

Phiên bản thứ hai cho phép nhập nhiều văn bản trên cùng một trang bị khóa thoát - chỉ miễn là chúng có thuộc tính onFocus được đặt ở trên (nhiều phần tử sẽ không ảnh hưởng lẫn nhau). Nó cũng kiểm tra các đối tượng được truyền cho nó được xác định, để ngăn chặn tình cờ thực hiện sai cho IE một cơn đau tim!

Tôi hy vọng điều này sẽ hữu ích.

0

Khi thoát được phát hiện làm những gì là cần thiết để được thực hiện và vào cuối return false;

Nó giải quyết các vấn đề trong firefox 25 cho tôi.

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