Kích hoạt JavaScript onblur

Trong JavaScript, onblur là một sự kiện tích hợp được kích hoạt khi người dùng di chuyển con trỏ ra khỏi phần tử. Sự kiện này ngược với sự kiện onfocus của JavaScript. Nói chung, sự kiện onblur trong JavaScript được sử dụng với các phần tử xác thực biểu mẫu. Giả sử chúng ta có một biểu mẫu trong đó người dùng cần nhập tên đầy đủ của mình. Nếu con trỏ của người dùng nằm trên trường văn bản đó, thì hộp văn bản sẽ ở chế độ tiêu điểm, nhưng nếu con trỏ nằm ngoài trường văn bản đó thì trường văn bản sẽ bị mờ. Trong trường hợp này, sự kiện onblur có thể được sử dụng để thực hiện xác thực

object.onblur = function[]{onblurEvent};
Chúng ta cũng có thể sử dụng phương thức addEventListener[] trong JavaScript để sử dụng sự kiện onblur
object.addEventListener["blur", onblurEvent];
Phương thức addEventListener[] chỉ được hỗ trợ trong và sau phiên bản chrome 8

Enter your full name: 






đầu ra
Khi phần tử nằm trên trường văn bản
Khi phần tử nằm ngoài phạm vi của trường văn bản, onblur được thực thi và các ký tự chữ thường được chuyển đổi thành ký tự chữ hoa như hình bên dưới

ALL HTML elements, except: , , 
, , , , , , 
    
đầu ra
Khi con trỏ qua trường văn bản
Khi con trỏ bị xóa khỏi trường văn bản, cửa sổ bật lên xuất hiện hiển thị "Mất tiêu điểm"
ví dụ 2. Ở đây chúng tôi đã sử dụng sự kiện onblur trong JavaScript

  





    
        
        Scaler Academy
    
        
example of HTML DOM onblur event
        

        
    



đầu ra
Khi con trỏ ở trên trường văn bản
Khi con trỏ bị xóa khỏi trường văn bản
ví dụ 3. Đưa ra dưới đây là một ví dụ về phương thức addEventListener[] trong JavaScript nơi sử dụng sự kiện onblur




    
        
        Scaler Academy
    
        
example of HTML DOM onblur event
        

        
    




đầu ra
Khi con trỏ ở trên trường văn bản
Khi con trỏ bị xóa khỏi trường văn bản hoặc tiêu điểm bị mất
Ví dụ 4. sự kiện onblur trong JavaScript cũng có thể được sử dụng để kiểm tra xem đầu vào đã cho có chứa số nguyên hay không. Đưa ra dưới đây là một ví dụ để kiểm tra xem đầu vào có chứa số nguyên hay không





example of JavaScript onblur Event






 example of JavaScript onblur Event 
 Click the textbox and then click outside to trigger the onblur event 

  





 Field Validation 

 Default Text 





đầu ra
Theo mặc định
Khi đầu vào chứa một số nguyên
Khi đầu vào không chứa số nguyên
Trình duyệt được hỗ trợ
Sau đây là tên của các trình duyệt hỗ trợ sự kiện onblur trong JavaScript
Tên trình duyệtHỗ trợ trên phiên bản Phiên bản Internet Explorer >= 6[Aug 2001]Mozilla Firefox Version >= 2[Oct 2006]Microsoft Edgeversion >= 12[Jul 2015]Google Chromeversion >= 4[Jan 2010]Safariversion >= 3. 1[Tháng 3 năm 2008]
 

			
Điều gì kích hoạt Onblur?
			
onBlur kích hoạt  khi tiêu điểm bị mất khỏi thành phần đầu vào trong ngữ cảnh . trong phản ứng. js, chúng tôi liên kết các trình xử lý sự kiện bằng cách chuyển một phương thức được xác định trong thành phần để được gọi tương ứng.  . bind[this] được gọi để giữ lại giá trị của this và hiển thị các phương thức thành phần trong hàm xử lý sự kiện, chẳng hạn như this. 
		
			
Làm cách nào để kích hoạt JavaScript sự kiện mờ?
			
Sự kiện mờ xảy ra khi một phần tử mất tiêu điểm.  Phương thức blur[]  kích hoạt sự kiện mờ hoặc đính kèm một chức năng để chạy khi xảy ra sự kiện mờ. Mẹo. Phương thức này thường được sử dụng cùng với phương thức focus[]. 
		
			
Làm cách nào để sử dụng Onblur trong xác thực JavaScript?
			
Sự kiện onblur . 
 
Example. Execute a JavaScript when a user leaves an input field: .
 
In HTML: .
 
Ví dụ. Sử dụng các thuộc tính onfocus và onblur.  .  
 
Ví dụ. ủy quyền sự kiện. sử dụng các sự kiện lấy nét và làm mờ.  .  
 
Ví dụ. ủy quyền sự kiện. sử dụng các sự kiện focusin và focusout
 
		
			
Div có Onblur được không?
			
Sự kiện làm mờ kích hoạt khi mất tiêu điểm.  Theo mặc định, phần tử div không thể có tiêu điểm ở vị trí đầu tiên để nó không thể bị mất .