Làm thế nào tôi có thể nhận được giá trị MỚI của đầu vào văn bản HTML trong một sự kiện nhấn phím qua jQuery?

Question

Tôi chỉ có thể truy xuất giá trị mà không cần bấm phím mới. Sử dụng sự kiện keyup không phải là một tùy chọn, vì nó không kích hoạt nếu người dùng không giải phóng khóa. Điều này là quan trọng bởi vì tôi muốn hành động theo từng phím bấm.

Kết hợp giá trị cũ với mã khóa có thể truy cập được từ đối số của sự kiện không được chấp nhận, vì không đảm bảo rằng người dùng sẽ nhập vào cuối chuỗi trong hộp văn bản.

Answer 1

Có thể tìm ra giá trị sẽ sau khi nhấn phím. Thật dễ dàng trong các trình duyệt IE không và phức tạp hơn trong IE, nhưng sau đây sẽ làm điều đó:

document.getElementById("your_input").onkeypress = function(evt) { 
    var val = this.value; 
    evt = evt || window.event; 
    var charCode = typeof evt.which == "number" ? evt.which : evt.keyCode; 
    if (charCode) { 
     var keyChar = String.fromCharCode(charCode); 
     var start, end; 
     if (typeof this.selectionStart == "number" && typeof this.selectionEnd == "number") { 
      start = this.selectionStart; 
      end = this.selectionEnd; 
     } else if (document.selection && document.selection.createRange) { 
      // For IE up to version 8 
      var selectionRange = document.selection.createRange(); 
      var textInputRange = this.createTextRange(); 
      var precedingRange = this.createTextRange(); 
      var bookmark = selectionRange.getBookmark(); 
      textInputRange.moveToBookmark(bookmark); 
      precedingRange.setEndPoint("EndToStart", textInputRange); 
      start = precedingRange.text.length; 
      end = start + selectionRange.text.length; 
     } 
     var newValue = val.slice(0, start) + keyChar + val.slice(end); 
     alert(newValue); 
    } 
}; 

Answer 2

Quấn mã xử lý của bạn trong setTimeout(function() { ... }, 0).

Điều này sẽ thực thi mã trong vòng lặp tin nhắn tiếp theo, sau khi value đã được cập nhật.

Answer 3

Đây là ý tưởng có thể hoạt động. Sử dụng nhấn phím và lưu trữ val tại điểm đó để bạn luôn có thể so sánh giá trị hiện tại với giá trị cuối cùng và tìm sự khác biệt trong chuỗi. Sự khác biệt sẽ là chìa khóa được nhấn.

Một cách để làm điều này là biến chuỗi thành mảng và so sánh 2 mảng như họ đang làm gì ở đây: JavaScript array difference

Không bao giờ thử bất cứ điều gì như thế này để nó có thể không khả thi nhưng có thể là giá trị một shot .

Answer 4

Tôi đã có một trường hợp cụ thể với phím TAB, làm thay đổi e.target trong KeyUp, vì vậy đó là giải pháp - ràng buộc để phần tử container, lấy mục tiêu đầu vào trong trình xử lý keyDown, đăng ký keyUp và đọc giá trị.

$("#container").keydown(function (e) { 
    //here you decide whether to handle the key event, and grab the control that sent the event 
    var myInput = e.target; 
    $("#container").one('keyup', function() { 
     console.log(myInput.val()); 
     // do smth here 
    }); 
});