Sự kiện hộp văn bản Javascript

Question

Tôi đang gặp vấn đề với kiểu nhập văn bản (ví dụ: Hộp văn bản).

Tôi đã viết một chức năng được sử dụng bởi sự kiện onkeyup trên Hộp văn bản. Điểm mấu trông như thế này:

<input type='TEXT' value='abc' onkeyup='changeSomething(this);'> 

Nhưng bây giờ tôi đang phải đối mặt với vấn đề mà khi người dùng lựa chọn các giá trị từ các giá trị đã nhập trước đó, tôi không nhận được bất kỳ sự kiện khi người dùng chọn bất kỳ giá trị đã nhập trước đó từ trình đơn thả xuống (chỉnh sửa: Tôi tin rằng anh ấy đang đề cập đến trình duyệt tự động hoàn tất tại đây).

Có ai có giải pháp cho việc này không? :)

Answer 1

sử dụng onchange thay vì onkeyup trong trường hợp này

see: http://www.w3schools.com/jsref/event_onchange.asp

ví dụ

<input type='text' value='abc' onchange='changeSomething(this);' /> 

để có được xung quanh

EDIT này Hai điều:
1) giá trị Autocomplete thể được lựa chọn sử dụng các phím mũi tên và nhập/tab, và bằng cách sử dụng chuột. Các phím mũi tên/enter.tab kích hoạt các sự kiện onkeyup ... khi nhấp vào hộp tự động hoàn tất thì không kích hoạt sự kiện onclick.
2) Sự kiện trao đổi sẽ kích hoạt ngay khi lấy nét bị mất Nếu nội dung đã thay đổi. Tiêu điểm không bị mất khi chọn giá trị tự động hoàn thành.

Về cơ bản, dường như không có cách nào để đảm bảo hợp lý sự kiện sẽ được xử lý theo cách bạn muốn.

Trước hết, bạn có thực sự cần nghe mọi phím tắt không? Thứ hai, bạn có được phục vụ tốt hơn bằng cách tắt tự động hoàn tất không? (ví dụ <input type='text' value='abc' autocomplete='off' onkeyup='changeSomething(this);' />)

Answer 2

Dưới đây là một giải pháp mà các cuộc thăm dò các yếu tố định kỳ đối với bất kỳ thay đổi

<script type="text/javascript"> 

var changeWatcher = { 
    timeout: null, 
    currentValue: '', 
    watchForChange: function(el) { 
     if(el.value != this.currentValue) { 
      this.changed(el); 
     } 
     this.timeout = setTimeout(function() { 
      changeWatcher.watchForChange(el) 
     }, 200); 
    }, 
    cancelWatchForChange: function() { 
     clearTimeout(this.timeout); 
     this.timeout = null; 
    }, 
    changed: function(el) { 
     this.currentValue = el.value; 
     // do something with the element and/or it's value 
     //console.log(el.value); 
    } 
} 

</script> 
<input type='text' value='abc' onfocus='changeWatcher.watchForChange(this)' onblur='changeWatcher.cancelWatchForChange()' onchange='changeWatcher.changed(this)' />