जब एचटीएमएल 5 सत्यापन का उपयोग किया जाता है तो सबमिट ईवेंट से कैसे जुड़ें?

एचटीएमएल 5 सत्यापन का उपयोग करना ...जब एचटीएमएल 5 सत्यापन का उपयोग किया जाता है तो सबमिट ईवेंट से कैसे जुड़ें?

एचटीएमएल 5 ब्राउज़रों में, मान्यता होती है से पहले submit घटना। तो अगर फॉर्म अमान्य है, सबमिट घटना कभी नहीं आग लगती है।

मैं फॉर्म को सबमिट करने के लिए एक फॉर्म को हुक करना चाहता हूं, फॉर्म को मान्य करता है या नहीं। यहां एक छोटा सा उदाहरण दिया गया है, जहां मैं alert() पर प्रयास कर रहा हूं जब उपयोगकर्ता फॉर्म सबमिट करता है।

HTML:

<!DOCTYPE html> 
<html> 
    <head><title>Example</title></head> 
    <body> 
     <form> 
      <input type="text" name="foo" required title="Foo field"/> 
      <input type="submit"/> 
     </form> 
    </body> 
</html>

जावास्क्रिप्ट:

$(function() { 
    $('form').submit(function() { 
     alert('submit!') 
    }); 
});

इंटरएक्टिव डेमो: http://jsfiddle.net/gCBbR/

मेरा प्रश्न है: ब्राउज़रों एक वैकल्पिक घटना है कि मुझे लगता है कि इससे पहले कि चलेंगे करने के लिए बाध्य कर सकते हैं प्रदान करते हैं सत्यापन?

स्रोत

2011-09-28 Portman

हाँ, वहाँ है कि कारण के लिए एक घटना है स्थायी हैंडलिंग उपयोग के लिए, केवल एक बार निष्पादित किया जाएगा। ईवेंट को invalid कहा जाता है जब उपयोगकर्ता एचटीएमएल 5 सत्यापन विधि checkValidity() के माध्यम से वैधता की जांच करते समय ऑर के लिए जमा करने का प्रयास करता है। यह घटना blur पर या checkValidity() पर कॉल किए बिना ऐसा कुछ नहीं है क्योंकि आपके पास आपके input टैग में HTML सत्यापन गुण हैं। लेकिन यह फॉर्म जमा करने से पहले आग लगती है।

जब checkValidity() विधि शुरू हो जाती है, अगर तत्व बाधा सत्यापन के लिए एक उम्मीदवार है और इसकी की कमी को पूरा नहीं करता है, उपयोगकर्ता एजेंट invalid नाम के एक साधारण घटना आग चाहिए:
W3C से
यह तत्व पर रद्द करने योग्य है (लेकिन इस मामले में कोई डिफ़ॉल्ट कार्रवाई नहीं है) और झूठी वापसी करें। अन्यथा, यह केवल के बिना कुछ और करने के बिना सच होना चाहिए। आप invalid ईवेंट को सक्रिय करने के लिए यदि input डेटा अमान्य है checkValidity() कॉल करने की आवश्यकता
<form> 
      <input type="text" name="foo" required title="Foo field"/> 
      <input type="submit"/> 
</form> 
तब:

उदाहरण के लिए आप इस मार्कअप है

मेरे उदाहरण यहाँ पर

document.querySelectorAll('input')[0].addEventListener('blur', function(){ 
     this.checkValidity(); 
    }, false); 

document.querySelectorAll('input')[0].addEventListener('invalid', function(){ 
     console.log('invalid fired'); 
    }, false);

देखो: http://jsbin.com/eluwir/2

स्रोत

2011-09-28 18:29:12 Mohsen

वास्तव में यह पूरी तरह से सच नहीं है।अमान्य घटना प्रोग्रामेटिक बाधा सत्यापन (चेक वैलिटीटी) * और * इंटरैक्टिव फॉर्म सत्यापन (उपयोगकर्ता अमान्य इनपुट के साथ एक फॉर्म जमा करने का प्रयास करता है) के साथ निकाल दिया जाता है। इसके अतिरिक्त 2 अन्य बड़े अंतर हैं, अमान्य को प्रत्येक अमान्य इनपुट के लिए निकाल दिया जाता है और केवल एक बार सबमिट किया जाता है + अमान्य ईवेंट फ़ॉर्म पर बबल नहीं होता है (आप कैप्चर का उपयोग कर सकते हैं ...)। –

@alexanderfarkas, आप पूरी तरह से सही हैं। मैंने विनिर्देश को गलत समझा। मेरा जवाब संपादित किया। यह घटना यहां सबमिट करने से पहले आग लगती है: http://jsbin.com/eluwir/3/edit – Mohsen

-1

$(function() { 
    $('form').one('submit',function() { 
     alert(1); 

     [...] 

     $(this).submit(); // optional 
     return false; // returning false skips validator's trigger 
    }); 
});

इस कोड $.bind

स्रोत

2011-09-28 18:15:48 bazilio

मुझे लगता है कि आप इस प्रश्न को गलत समझते हैं। यदि सबमिट एचटीएमएल 5 सत्यापन विफल रहता है तो जमा ईवेंट कभी नहीं निकाल दिया जाता है। – Portman

-2

यदि आप ब्राउज़र डिफ़ॉल्ट va का उपयोग करना चाहते हैं लिडेशन आपको निम्नलिखित का उपयोग करना चाहिए क्योंकि आपको डिफ़ॉल्ट सबमिट करने की आवश्यकता है, फिर इसे रोकें और $ .ajax या $ .post

$("form").bind('submit', function(e){ 
     e.preventDefault(); 

     $.post("url",$("form").serialize(),function(data){ 
          $("#result").html(data).show(); 
           }); 
     });

स्रोत

2012-10-30 08:47:59 Bakly

जब एचटीएमएल 5 सत्यापन का उपयोग किया जाता है तो सबमिट ईवेंट से कैसे जुड़ें?

उत्तर

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