Hướng dẫn javascript input value change - thay đổi giá trị đầu vào javascript

Mục lục

1- ChangeEvent

Sự kiện change xẩy ra trong các tình huống sau: change xẩy ra trong các tình huống sau:

1. Người dùng check/uncheck trên .check/uncheck trên .
2. Người dùng thay đổi trên ..
3. Người dùng thay đổi giá trị của [file, color, range]. [file, color, range].
4. Người dùng thay đổi nội dung của [text, number, email, password, tel, time, week, month, date, datetime-local, search, url], sau đó focus sang nơi khác. [ text, number, email, password, tel, time, week, month, date, datetime-local, search, url], sau đó focus sang nơi khác.
5. Người dùng thay đổi nội dung của , sau đó focus sang nơi khác., sau đó focus sang nơi khác.
6. Người dùng thay đổi lựa chọn [option] trên phần tử ..

ChangeEvent thừa kế tất cả các thuộc tính [property] và phương thức của interface Event. thừa kế tất cả các thuộc tính [property] và phương thức của interface Event.

• TODO Link?

Ví dụ với sự kiện change: change:

changeevents-elements-example.html

   
      ChangeEvent Example
      

      .title {font-weight:bold;}

      
          function changeHandler[evt]  {
            alert["Changed!"];
          }
      

   
   

      
ChangeEvent example

      
Input [checkbox, radio]:
      
      
      

      
Input [range]:
      

      
Input [color]:
      

      
Input [file]:

  


      


      
Input [image, hidden, buton, submit, reset]:
        - [Not support 'change' event]

      
Input [text, number, email, password, tel, time, week, month, date, datetime-local, search, url]:
      

      
Textarea element
      

      
Select:
      
         English
         German
         Vietnamese
      

      



   

 

Ví dụ với sự kiện change trên phần tử : change trên phần tử :

changeevents-select-example.html

   
      ChangeEvent Example
      

      
          function changeHandler[evt]  {
            alert["Language: " + evt.target.value];
          }
      

   
   

      
ChangeEvent example

      
Select Language:
      
         English
         German
         Vietnamese
      


   


 

Event: change vs input

Bạn có thể cân nhắc sử dụng sự kiện input vì nó khá giống với sự kiện change: input vì nó khá giống với sự kiện change:

• Sự kiện input xẩy ra ngay sau khi giá trị của một phần tử thay đổi, mà không yêu cầu phần tử phải mất focus.input xẩy ra ngay sau khi giá trị của một phần tử thay đổi, mà không yêu cầu phần tử phải mất focus.
• Sự kiện input hỗ trợ các phần tử với thuộc tính [attribute] contenteditable="true". Trong khi sự kiện change chỉ hỗ trợ các phần tử , , .input hỗ trợ các phần tử với thuộc tính [attribute] contenteditable="true". Trong khi sự kiện change chỉ hỗ trợ các phần tử , , .