HTML onsearch इवेंट एट्रिब्यूट

विवरण

HTML onsearch इवेंट एट्रिब्यूट HTML दस्तावेज़ में जब उपयोगकर्ता type="search" वाले HTML इनपुट तत्व में "Enter" कुंजी दबाता है, तब ट्रिगर होता है।

सिंटैक्स

<input type="search" onsearch="script">

उदाहरण

आइए HTML onsearch इवेंट एट्रिब्यूट का एक उदाहरण देखें:

<!DOCTYPE html> <html> <head> <style> 
  body { 
    color: #000; 
    height: 100vh; 
    background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) no-repeat; 
    text-align: center; 
    padding: 20px; 
  } 
  input { 
    border: 2px solid #fff; 
    background: transparent; 
    height: 2rem; 
    padding: 10px; 
    width: 200px; 
  } 
  ::placeholder { 
    color: #000; 
  } 
  .show { 
    font-size: 1.5rem; 
    font-weight: bold; 
  } 
</style> </head> <body> 
<h1>HTML onsearch इवेंट एट्रिब्यूट डेमो</h1> 
<input type="search" onsearch="searchFn()" placeholder="यहां खोजें"> 
<p>आप जो खोजना चाहते हैं उसे दर्ज करें और फिर "Enter" कुंजी दबाएं</p> 
<div class="show"></div> 
<script> 
  function searchFn() { 
    document.body.style.background = "linear-gradient(45deg, #8BC6EC 0%, #9599E2 100%) no-repeat"; 
    document.querySelector(".show").innerHTML = "आपने खोजा: " + document.querySelector("input").value; 
  } 
</script> </body> </html>

आउटपुट

खोज फ़ील्ड में अपना खोज टेक्स्ट दर्ज करें और फिर "Enter" कुंजी दबाकर देखें कि onsearch इवेंट एट्रिब्यूट कैसे काम करता है।