2011-03-06 11 views
18

मैं एक onBlur घटना श्रोता के साथ एक इनपुट टैग है:कलंक() बनाम onBlur()

<input id="myField" type="input" onblur="doSomething(this)" /> 

वाया जावास्क्रिप्ट, मैं इस इनपुट पर कलंक घटना ट्रिगर करना चाहते हैं इतना है कि यह, बारी में, कॉल doSomething फ़ंक्शन।

document.getElementById('myField').blur() 

लेकिन वह काम नहीं करता (कोई त्रुटि हालांकि):

मेरे प्रारंभिक सोचा कलंक कॉल करने के लिए है।

यह करता है:

document.getElementById('myField').onblur() 

कि क्यों है? .click() ऑनक्लिक श्रोता के माध्यम से किसी तत्व से जुड़े क्लिक ईवेंट को कॉल करेगा। blur() क्यों काम नहीं करता है?

+1

मुझे लगता है कि ब्लर() jQuery है और ऑनब्लर() जावास्क्रिप्ट है। – Ray

+0

@ रे नहीं, यह वास्तव में सटीक नहीं है, हालांकि यह सच है कि jQuery किसी ईवेंट को ट्रिगर करने के लिए "ब्लर" विधि प्रदान करता है (या एक हैंडलर पंजीकृत करता है)। यह विधि jQuery ऑब्जेक्ट्स द्वारा प्रदान की जाती है, हालांकि, और सादे डीओएम तत्वों पर उपलब्ध नहीं है। – Pointy

उत्तर

23

यह:

document.getElementById('myField').onblur(); 

काम करता है क्योंकि आपके तत्व (<input>) एक विशेषता "onBlur" जिसका मूल्य एक समारोह है कहा जाता है। इस प्रकार, आप इसे कॉल कर सकते हैं। आप ब्राउज़र को वास्तविक "धुंध" ईवेंट अनुकरण करने के लिए कह रहे हैं; उदाहरण के लिए, कोई इवेंट ऑब्जेक्ट नहीं बनाया गया है।

तत्वों में "धुंध" विशेषता नहीं है (या "विधि" या जो कुछ भी है, इसलिए यही पहली बात काम नहीं करती है।

+0

लेकिन आप क्लिक क्लिक को अनुकरण करने के लिए .click() को कॉल कर सकते हैं, सही? मेरी गलती मान रही थी। ब्लर() भी अस्तित्व में था। जवाब के लिए धन्यवाद! –

+3

@DA: '.blur()' कुछ ब्राउज़रों में मौजूद है, लेकिन अगर आपको यह नहीं है तो आपको पहले तत्व फोकस देना होगा। [इस उदाहरण को आजमाएं] (http://jsfiddle.net/zYQqa/1/) क्रोम में। मुझे नहीं पता कि कौन से ब्राउज़र इसका समर्थन नहीं करते हैं/नहीं करते हैं। – user113716

+1

हां, क्योंकि ब्राउज़र ** ** ** "क्लिक" नामक DOM तत्वों पर एक विधि का समर्थन करते हैं। मैं मानता हूं कि यह सिर्फ संगत नहीं है; इनमें से कई चीजें 10 या उससे अधिक साल पहले जल्दी विकसित हुईं, इससे पहले कि किसी को सिंक्रनाइज़ेशन के बारे में ज्यादा सोचने का मौका मिले। मुझे लगता है कि प्रोटोटाइप और jQuery जैसे पुस्तकालय इतने लोकप्रिय हैं कि मुख्य कारणों में से एक है। – Pointy

2

मुझे लगता है कि यह सिर्फ इसलिए onBlur घटना एक परिणाम के इनपुट को खोने ध्यान देने का के रूप में कहा जाता है, वहाँ एक कलंक, एक इनपुट के साथ जुड़े कार्रवाई नहीं है एक क्लिक एक साथ जुड़े कार्रवाई होती है की तरह है बटन

10

किस बिंदु के अनुसार, blur() विधि मौजूद है और w3c standard का हिस्सा है। ,

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
    <head> 
     <title>Javascript test</title> 
     <script type="text/javascript" language="javascript"> 
      window.onload = function() 
      { 
       var field = document.getElementById("field"); 
       var link = document.getElementById("link"); 
       var output = document.getElementById("output"); 

       field.onfocus = function() { output.innerHTML += "<br/>field.onfocus()"; }; 
       field.onblur = function() { output.innerHTML += "<br/>field.onblur()"; }; 
       link.onmouseover = function() { field.blur(); }; 
      }; 
     </script> 
    </head> 
    <body> 
     <form name="MyForm"> 
      <input type="text" name="field" id="field" /> 
      <a href="javascript:void(0);" id="link">Blur field on hover</a> 
      <div id="output"></div> 
     </form> 
    </body> 
</html> 

ध्यान दें कि मैं link.onclick के बजाय link.onmouseover इस्तेमाल किया क्योंकि अन्यथा क्लिक ही फोकस हटा दिया है |: निम्नलिखित exaple (आईई सहित) हर आधुनिक ब्राउज़र में काम करेंगे।

संबंधित मुद्दे