दिलचस्प पोस्ट
स्क्रॉल डाउन पर फ़ेड इन करें, फलक आउट ऑन स्क्रॉल अप – विंडो में तत्व की स्थिति के आधार पर उद्देश्य-सी प्रतिनिधियों को आमतौर पर बनाए रखने के बजाय संपत्ति को क्यों दिया जाता है? ऑपरेटिंग सिस्टम के विकास में शुरू करने के लिए कुछ संसाधन क्या हैं? JQuery के। टॉगल () विधि के लिए विकल्प जो इवेंटडेटा का समर्थन करता है? कार्य में ईवेंट को परिवर्तित करने के लिए पुन: प्रयोज्य पैटर्न बंद करने के बारे में, लेक्सिकल पर्यावरण और जीसी शा और बाश के बीच अंतर एंड्रॉइड व्यू में उठने वाले अक्सर मुद्दे, XML को पार्स करने में त्रुटि: अनबाउंड उपसर्ग हैश टकराव – संभावना क्या हैं? क्या पॉडकास्ट नियंत्रण दिखाने के लिए MPNowPlayingInfoCenter को मजबूर करने का कोई सार्वजनिक तरीका है? जावास्क्रिप्ट प्रोटोटाइप ऑपरेटर प्रदर्शन: स्मृति बचाता है, लेकिन क्या यह तेज़ है? पीजी मणि स्थापित करने का प्रयास करते समय 'libpq-fe.h शीर्षलेख नहीं मिला मैं गलत गिट धक्का -f मूल मास्टर से कैसे पुनर्प्राप्त कर सकता हूं? क्या यह इक्ससशिप। एक्सएमएलवर्कर एम्बेडेड छवियों को प्रस्तुत कर सकता है? T-SQL: joins के माध्यम से हटाने के लिए पंक्तियां चयन करना

आवश्यक विशेषता सफ़ारी ब्राउज़र में काम नहीं करती

आवश्यक फ़ील्ड को सूचित करने के लिए आवश्यक फ़ील्ड बनाने के लिए, लेकिन सफारी ब्राउज़र में काम नहीं करने के लिए मैंने निम्न कोड की कोशिश की है कोड:

<form action="" method="POST"> <input required />Your name: <br /> <input type="submit" /> </form> 

फ़ायरफ़ॉक्स में कोड काम के ऊपर http://jsfiddle.net/X8UXQ/179/

क्या आप मुझे जावास्क्रिप्ट कोड या किसी भी कार्यक्षेत्र को बता सकते हैं? जावास्क्रिप्ट में नया हूँ

धन्यवाद

वेब के समाधान से एकत्रित समाधान "आवश्यक विशेषता सफ़ारी ब्राउज़र में काम नहीं करती"

सफ़ारी इस विशेषता का समर्थन नहीं करता, आपको जावास्क्रिप्ट का उपयोग करना होगा इस पृष्ठ में एक हैकी समाधान है, जिसे वांछित कार्यक्षमता जोड़नी चाहिए:

http://www.html5rocks.com/en/tutorials/forms/constraintvalidation/#toc-safari

HTML:

 <form action="" method="POST" id="formID"> Your name: <input required = "true"/> <br /> <input type="submit" /> </form> 

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

 var form = document.getElementById('formID'); // form has to have ID: <form id="formID"> form.noValidate = true; form.addEventListener('submit', function(event) { // listen for form submitting if (!event.target.checkValidity()) { event.preventDefault(); // dismiss the default functionality alert('Please, fill the form'); // error message } }, false); 

आप चेतावनी को कम बदसूरत चेतावनी के साथ बदल सकते हैं, जैसे त्रुटि संदेश के साथ एक DIV दिखाएं:

 document.getElementById('errorMessageDiv').style.display = 'block'; 

और HTML में:

 <div id="errorMessageDiv" style="display:block;">Please, fill the form.</div> 

(शैली विशेषता की सामग्री सीएसएस फ़ाइल में होनी चाहिए)

इस दृष्टिकोण का एकमात्र दोष यह है कि वह सटीक इनपुट को संभाल नहीं लेता है जिसे भरने की आवश्यकता है। इसमें प्रपत्र में सभी निविष्टियों में एक लूप की आवश्यकता होगी और मूल्य (और बेहतर, "अपेक्षित" विशेषता उपस्थिति की जाँच करें) की जांच करनी होगी।

यदि आप jQuery के साथ जाते हैं तो नीचे कोड बहुत बेहतर है बस jquery.min.js फ़ाइल के इस कोड नीचे डाल दिया है और यह हर प्रपत्र के लिए काम करता है।

बस अपने सामान्य .js फ़ाइल पर इस कोड को डालें और इस फ़ाइल jquery.js या jquery.min.js के बाद एम्बेड करें

 $("form").submit(function(e) { var ref = $(this).find("[required]"); $(ref).each(function(){ if ( $(this).val() == '' ) { alert("Required field should not be blank."); $(this).focus(); e.preventDefault(); return false; } }); return true; }); 

यह कोड उन ब्राउज़र के साथ काम करता है जो आवश्यक (html5) विशेषता का समर्थन नहीं करता है

एक अच्छे कोडिंग दिन के दोस्त हैं।

मैं सफारी के साथ एक ही समस्या थी और मैं केवल आपको सबको माफ़ी माँगने के लिए ही माँग सकता हूँ!

मुझे इस प्रश्न का समाधान मिला है और इसके लिए यह बहुत ही उपयोगी है, लेकिन अगर आप सफ़ारी के लिए देशी एचटीएमएलआई इनपुट सत्यापन "अनुकरण" करना चाहते हैं, तो वेबशिम आपको बहुत समय बचाता है।

Webshim सफारी के लिए कुछ "उन्नयन" बचाता है और इसे एचएमटीएल 5 डेटककर या फॉर्म वैधीकरण जैसी चीजों को संभालने में मदद करता है। यह कार्यान्वयन करना आसान नहीं है, लेकिन यह अभी भी इसका सही उपयोग करने के लिए पर्याप्त अच्छा लगता है।

यहां तक कि webshim के लिए प्रारंभिक सेट के लिए SO पर भी उपयोगी उत्तर! लिंक किए गए पोस्ट की प्रतिलिपि:

इस समय, सफारी "अपेक्षित" इनपुट विशेषता का समर्थन नहीं करता है। http://caniuse.com/#search=required

सफारी पर 'आवश्यक' विशेषता का उपयोग करने के लिए, आप 'webshim' का उपयोग कर सकते हैं

1 – डाउनलोड webshim

2 – यह कोड डालें:

 <head> <script src="js/jquery.js"></script> <script src="js-webshim/minified/polyfiller.js"></script> <script> webshim.activeLang('en'); webshims.polyfill('forms'); webshims.cfg.no$Switch = true; </script> </head> 

मुझे इस समस्या के समाधान के साथ एक महान ब्लॉग एंट्री मिली। यह इसे एक तरह से हल करता है कि मैं और अधिक आरामदायक हूं और यहां अन्य सुझावों की तुलना में बेहतर उपयोगकर्ता अनुभव प्रदान करता है। यह इंगित करने के लिए फ़ील्ड का पृष्ठभूमि रंग बदल जाएगा यदि इनपुट मान्य है या नहीं।

सीएसएस:

 /* .invalid class prevents CSS from automatically applying */ .invalid input:required:invalid { background: #BE4C54; } .invalid textarea:required:invalid { background: #BE4C54; } .invalid select:required:invalid { background: #BE4C54; } /* Mark valid inputs during .invalid state */ .invalid input:required:valid { background: #17D654 ; } .invalid textarea:required:valid { background: #17D654 ; } .invalid select:required:valid { background: #17D654 ; } 

जे एस:

 $(function () { if (hasHtml5Validation()) { $('.validate-form').submit(function (e) { if (!this.checkValidity()) { // Prevent default stops form from firing e.preventDefault(); $(this).addClass('invalid'); $('#status').html('invalid'); } else { $(this).removeClass('invalid'); $('#status').html('submitted'); } }); } }); function hasHtml5Validation () { return typeof document.createElement('input').checkValidity === 'function'; } 

क्रेडिट: http://blueashes.com/2013/web-development/html5-form-validation-fallback/

(ध्यान दें: मैंने टेस्टरेआ को कवर करने के लिए पोस्ट से सीएसएस का विस्तार किया और फ़ील्ड का चयन किया)

मैंने @ रोनी के शीर्ष पर एक समाधान बनाया है

ऐसा लगता है कि Webshim deprecating है क्योंकि यह jquery 3.0 के साथ संगत नहीं होगा।

यह समझना महत्वपूर्ण है कि सफ़ारी आवश्यक विशेषता को मान्य करता है अंतर इसके साथ क्या करता है इनपुट के बगैर सबमिशन को अवरुद्ध करने और त्रुटि संदेश टूलटिप दिखाने के बजाय, यह बस फार्म का प्रवाह जारी होने दें

कहा जा रहा है कि, चेक वैधता () सफ़ारी में लागू की जाती है और यदि कोई आवश्यक दायर की गई है तो उसे गलत नहीं देता है।

इसलिए, "इसे ठीक करें" और कम से कम हस्तक्षेप (त्रुटि संदेशों को रखने के लिए कोई अतिरिक्त डिवा नहीं) के साथ एक त्रुटि संदेश दिखाएं और कोई अतिरिक्त लाइब्रेरी (jQuery को छोड़कर, लेकिन मुझे यकीन है कि यह सादे जावास्क्रिप्ट में किया जा सकता है)। मानक त्रुटि संदेश दिखाने के लिए प्लेसहोल्डर का उपयोग करके यह थोड़ा हैक मिला।

 $("form").submit(function(e) { if (!e.target.checkValidity()) { console.log("I am Safari"); // Safari continues with form regardless of checkValidity being false e.preventDefault(); // dismiss the default functionality $('#yourFormId :input:visible[required="required"]').each(function () { if (!this.validity.valid) { $(this).focus(); $(this).attr("placeholder", this.validationMessage).addClass('placeholderError'); $(this).val(''); // clear value so it shows error message on Placeholder. return false; } }); return; // its invalid, don't continue with submission } e.preventDefault(); // have to add it again as Chrome, Firefox will never see above } 

मैं इस समाधान का उपयोग करता हूं और ठीक काम करता हूं

 $('#idForm').click(function(e) { e.preventDefault(); var sendModalForm = true; $('[required]').each(function() { if ($(this).val() == '') { sendModalForm = false; alert("Required field should not be blank."); // or $('.error-message').show(); } }); if (sendModalForm) { $('#idForm').submit(); } }); 

आप अपने प्रपत्र में इस ईवेंट हैंडलर को जोड़ सकते हैं:

 // Chrome and Firefox will not submit invalid forms // so this code is for other browsers only (eg Safari). form.addEventListener('submit', function(event) { if (!event.target.checkValidity()) { event.preventDefault(); var inputFields = form.querySelectorAll('input'); for (i=0; i < inputFields.length; i++) { if (!inputFields[i].validity.valid) { inputFields[i].focus(); // set cursor to first invalid input field return false; } } } }, false); 

प्रत्येक () फ़ंक्शन के अंदर मुझे पीसी सफारी के पुराने संस्करण में पाठ इनपुट के सभी DOM तत्व मिले, मुझे लगता है कि यह कोड सभी गुणों और मूल्यों को प्राप्त करने के लिए inputobj ['prpertyname'] ऑब्जेक्ट का उपयोग करके मैक पर नए संस्करणों के लिए उपयोगी है:

  $('form').find("[required]").each(function(index, inputobj) { if (inputobj['required'] == true) { // check all required fields within the form currentValue = $(this).val(); if (currentValue.length == 0) { // $.each((inputobj), function(input, obj) { alert(input + ' - ' + obj); }); // uncomment this row to alert names and values of DOM object var currentName = inputobj['placeholder']; // use for alerts return false // here is an empty input } } }); 

26 फरवरी, 2017 को जारी नए सफारी 10.1, अब "आवश्यक" विशेषता का समर्थन करता है।

http://caniuse.com/#search=required