कैसे करें जावास्क्रिप्ट एक इनपुट आईडी

Question

मैं रूपों के लिए घटनाओं प्रस्तुत बाध्यकारी किया गया है, और यह सुनिश्चित करना है कि वे फार्म नहीं टूटते, इस तरह jQuery का उपयोग कर 'प्रस्तुत' के बराबर की उपस्थिति में प्रस्तुत:

jQuery('form').submit(function(e){ 
    var form = this; 
    e.preventDefault(); 
    alert('1'); 
    setTimeout(function() { 
     alert('2'); 
     form.submit(); 
     }, 1000); 

    }); 

यह सब अच्छा और अच्छा है, सिवाय इसके कि, अगर किसी कारण से फ्रंट एंड डेवलपर ने इस फ़ॉर्म का एक बच्चा इनपुट = "सबमिट" की आईडी दी है, तो यह ब्रेक, form.submit() एक जावास्क्रिप्ट त्रुटि फेंकता है (क्रोम में, 'अनकॉट टाइप एरर: ऑब्जेक्ट की संपत्ति 'सबमिट' # एक समारोह नहीं है ')।

आप इस बात का एक उदाहरण यहां देख सकते हो रहा: http://jsfiddle.net/q68ky/ (यहाँ व्यवहार अगर कोई <input id="submit">: http://jsfiddle.net/JpXzL/

अब, मैं जानता हूँ कि मैं रूपों है कि का एक आईडी के साथ बच्चे हैं पर बाध्यकारी से रोक सकते हैं 'प्रस्तुत 'jQuery('form').not(:has('#submit')).submit(), और साथ प्रपत्र ठीक पर कार्रवाई करेंगे, लेकिन मेरे लिए बाध्य उन रूपों के लिए कभी सक्रिय नहीं होगा

तो, सवाल:। कैसे मैं सुरक्षित रूप से, सभी रूपों को यह jQuery समारोह बाध्य कर सकते हैं साथ <input id="submit">

उन सहित?

संपादित करें: यह ध्यान देने योग्य है कि अगर मैं सबमिट हैंडलर को अनबिंड करता हूं और फिर एक jQuery को jQuery(form) पर सबमिट करता हूं तो यह समस्या दूर नहीं जाती है।

Answer 1

एक ही रास्ता मैं के बारे में सोच सकते हैं:

(function() { 
    var method; 

    window.submit = function (theForm) { 
     if (!method) { 
      method = document.createElement("form").submit; 
     } 

     method.call(theForm); 
    }; 
}()); 

फिर submit(theFormYouWantToSubmit) कहते हैं।

आप यहाँ कार्रवाई में इसे देख सकते हैं: http://jsfiddle.net/q68ky/2/

संपादित करें: यह क्या करता है के रूप में कुछ विवरण प्रदान करने के लिए ....

इस विधि एक नया रूप तत्व (document.createElement("form")) बनाता है, और इसके "सबमिट" विशेषता का संदर्भ संग्रहीत करता है (method = document.createElement("form").submit)। चूंकि यह एक नव निर्मित फॉर्म तत्व है, जिसमें कोई भी बच्चा नोड्स नहीं है, हम गारंटी दे सकते हैं कि "सबमिट" विशेषता वास्तव में "सबमिट" विधि के साथ एक बच्चे नोड के बजाय "सबमिट" विधि की आवश्यकता होती है।

हम तो call विधि (Function.prototype का हिस्सा), जो फार्म हम प्रस्तुत करने के लिए, बल्कि window वस्तु है, जो है क्या यह अन्यथा पर होगा की तुलना में चाहते हैं submit विधि के संदर्भ सेट का उपयोग करें।

स्निपेट में शेष गब्बिन्स submit विधि कैश करते हैं, ताकि जब भी आप फॉर्म जमा करना चाहते हैं, तब भी यह सब (हालांकि छोटे से ओवरहेड नहीं होता है, और स्थानीय क्षेत्र में कैश विधि को कैप्चर करता है, इसे वैश्विक दायरे में रखने और वैश्विक नामस्थान को प्रदूषित करने के बजाय।

Answer 2

त्रुटि तब होती है जब कोई फ़ॉर्म तत्व का नाम या आईडी 'सबमिट' हो। ऐसा लगता है कि यह jQuery के साथ एक मुद्दा है।

Answer 3

के बजाय form.submit();, आप

$(form).submit(); 

जरूरत है, जबकि $(form) jQuery वस्तु है इसका कारण यह है form सिर्फ नंगे डोम तत्व है। कॉलिंग form.submit()form की submit संपत्ति तक पहुंचने का प्रयास कर रहा है। चूंकि इसमें कोई नहीं है, यह बाल तत्व प्राप्त करने के पुराने स्कूल व्यवहार के लिए डिफ़ॉल्ट है जिसका idsubmit है (इसलिए "कोई फ़ंक्शन नहीं है" त्रुटि)।

Answer 4

इस के रूप में वास्तव में एक गैर jQuery समस्या है, यहाँ एक गैर jQuery समाधान है:

HTMLFormElement.prototype.submit.call(form); 

DEMO

संदर्भ: HTMLFormElement

अद्यतन:Access to the DOM prototypes is only possible in IE8+.(और है कि शायद यही वजह है कि jQuery इसका उपयोग नहीं करता है)।

@Matt's answer बजाय किसी भी ब्राउज़र

Answer 5

में समस्या मैं my other answer में पहचान काम करना चाहिए इसके अलावा, एक खुला jQuery बग मुद्दा और बदतर हो गयी है:

.SUBMIT() CAN FAIL IF SOMETHING HAS ID="SUBMIT"

If an element with an ID of submit exists in a form, .submit() can fail. It's important that this function (in particular) work correctly.

http://bugs.jquery.com/ticket/1414