फॉर्म जमा करने के लिए एक सामान्य लिंक का उपयोग करें

Question

मैं एक फॉर्म जमा करना चाहता हूं। लेकिन मैं सबमिट प्रकार के साथ एक इनपुट बटन का उपयोग करने का मूल तरीका नहीं है, लेकिन एक लिंक है।

नीचे दी गई छवि दिखाती है कि क्यों। मैं फ़ॉर्म को सहेजने / सबमिट करने के लिए छवि लिंक का उपयोग कर रहा हूं। क्योंकि मेरे पास इमेज लिंक के लिए standart css मार्कअप है, मैं इनपुट सबमिट बटन का उपयोग नहीं करना चाहता।

मैंने एक तत्व पर onClick = "document.formName.submit ()" लागू करने की कोशिश की, लेकिन मैं एक html विधि पसंद करूंगा।

कोई विचार?

Comments

बटन का उपयोग करें और छवि को प्रदर्शित करने या जावास्क्रिप्ट का उपयोग करने के लिए इसे सीएसएस करें, जावास्क्रिप्ट के बिना एक फॉर्म जमा करने के लिए सरल href करने का कोई वास्तविक तरीका नहीं है।

— एंटोन एस

मैं दूसरा, दुर्भाग्य से ये एक आसान तरीका w / o जावास्क्रिप्ट है

— benhowdle89

ऐसा करने का आपका कारण एक झूठी अर्थव्यवस्था जैसा लगता है। बटन सबमिट करने के लिए एक मानक सीएसएस के साथ आने के लिए बेहतर है और जिस तरह से वे डिजाइन किए गए थे उनका उपयोग करें। वहाँ बटन सीएसएस तकनीक के ढेर यहाँ का वर्णन कर रहे हैं: tripwiremagazine.com/2009/06/...

— dnagirl

Answer 1

दो तरीके। या तो एक बटन बनाएं और इसे स्टाइल करें ताकि यह सीएसएस के साथ लिंक की तरह दिखे, या एक लिंक बनाएं और उपयोग करें onclick="this.closest('form').submit();return false;"।

Comments

आआआआआआआआआँ और एक संदर्भ के रूप में एक बटन को शैली के लिए एक संदर्भ के रूप में देखें: stackoverflow.com/questions/1367409/…

— flipchart

ध्यान दें कि form.submit()जावास्क्रिप्ट के बिना काम नहीं करेगा

— baptx

@baptx भी पुराने स्मार्ट फोन ने जावास्क्रिप्ट को सक्षम किया है

— Mahdi Jazini

@MahdiJazini बहुत से लोग जावास्क्रिप्ट को डिफ़ॉल्ट रूप से अक्षम करते हैं जो कुछ मामलों में घुसपैठ और प्रदर्शन को प्रभावित कर सकता है। यदि जावास्क्रिप्ट विफल हो जाता है, तो यह पूरी वेबसाइट को तोड़ सकता है (जैसे कि स्थानीय गिरावट के बिना सीडीएन का उपयोग करके और तृतीय-पक्ष डोमेन अवरुद्ध है)। यदि HTML त्रुटि है, तो आप अभी भी वेबसाइट का उपयोग कर सकते हैं। डेवलपर्स को इसके बजाय प्रगतिशील वृद्धि सिद्धांत का पालन करना चाहिए।

— बपतिस्मा

यदि आप जावास्क्रिप्ट के बिना उपयोगकर्ताओं का समर्थन करना चाहते हैं, तो इस उत्तर में वर्णित पहला विकल्प करें, लिंक की तरह एक बटन स्टाइल करें। उदाहरण के लिए input[type=submit].link { border: none; background: none; display: inline; color: blue; text-decoration: underline; }और<input type=submit class="link" />

— जन सेवर

Answer 2

आप वास्तव में मेरे ज्ञान के सर्वश्रेष्ठ के लिए स्क्रिप्टिंग के कुछ फार्म के बिना ऐसा नहीं कर सकते।

<form id="my_form">
<!-- Your Form -->    
<a href="javascript:{}" onclick="document.getElementById('my_form').submit(); return false;">submit</a>
</form>

यहाँ से उदाहरण ।

Comments

और प्रिय आगंतुकों ... >>> आईडी = "my_form" सेट करने के लिए मत भूलना यह आईडी नाम नहीं है: डी

— महदी जज़िनी

यह सबसे अच्छा और स्पष्ट उत्तर होना चाहिए, धन्यवाद!

— योहानी

Answer 3

बस input type="submit"इस तरह से स्टाइल करना मेरे लिए काम कर गया:

.link-button { 
     background: none;
     border: none;
     color: #0066ff;
     text-decoration: underline;
     cursor: pointer; 
}

<input type="submit" class="link-button" />

क्रोम, IE 7-9, फ़ायरफ़ॉक्स में परीक्षण किया गया

Comments

सिर्फ रिकॉर्ड के लिए: आपको inputHTML तत्व को एक वर्ग संलग्न किए बिना सीएसएस चयनकर्ताओं का उपयोग करके उपयुक्त तत्व का चयन करना चाहिए ।

— एरिक कपलुन

यद्यपि आपकी टिप्पणी पसंदीदा तरीका है, यह हमेशा संभव नहीं है

— सर्ज सगन

वह पसंदीदा तरीका क्यों है?

— मार्क

यह एक अर्ध-स्थापित कोडिंग प्रथा है, आम तौर पर क्लीनर html के पीछे छोड़ देता है ... लेकिन यह बहुत बड़ी बात नहीं है

— सर्ज सगन

यह उत्तर या तो जावास्क्रिप्ट पर निर्भर नहीं करता है जो चिंता करने के लिए एक कम चीज है

— मैथ्यू लॉक

Answer 4

आप सबमिट करने के लिए छवियों का उपयोग कर रहे हैं .. इसलिए आप बस एक type="image"इनपुट "बटन" का उपयोग कर सकते हैं :

<input type="image" src="yourimage.png" name="yourinputname" value="yourinputvalue" />

Comments

... या इसमें एक <button>तत्व के साथ एक <img/>तत्व।

— DanMan

: यहाँ मामला किसी को भी इस के लिए MDN लिंक किसी और चाहते थे एक स्रोत है developer.mozilla.org/en-US/docs/Web/HTML/Element/input/image

— सैम

Answer 5

उपयोग:

<input type="image" src=".."/>

या:

<button type="send"><img src=".."/> + any html code</button>

प्लस कुछ सीएसएस

Answer 6

निश्चित रूप से, लिंक ( a) टैग के साथ फ़ॉर्म जमा करने के लिए शुद्ध HTML के साथ कोई समाधान नहीं है । मानक HTML केवल बटन या छवियों को स्वीकार करता है। जैसा कि कुछ अन्य सहयोगियों ने कहा है, एक बटन का उपयोग करके लिंक की उपस्थिति का अनुकरण कर सकता है, लेकिन मुझे लगता है कि यह सवाल का उद्देश्य नहीं है।

IMHO, मेरा मानना ​​है कि प्रस्तावित और स्वीकृत समाधान काम नहीं करता है।

मैंने इसे एक प्रपत्र पर परीक्षण किया है और ब्राउज़र को प्रपत्र का संदर्भ नहीं मिला।

इसलिए thisऑब्जेक्ट का उपयोग करते हुए जावास्क्रिप्ट की एक पंक्ति का उपयोग करके इसे हल करना संभव है , जो क्लिक किए जाने वाले तत्व का संदर्भ देता है, जो कि फॉर्म का एक बच्चा नोड है, जिसे प्रस्तुत करने की आवश्यकता है। तो this.parentNodeरूप नोड है। इसके बाद बस submit()उस रूप में कॉलिंग विधि। सही फ़ॉर्म को खोजने के लिए पूरे दस्तावेज़ से यह आवश्यक शोध नहीं है।

<form action="http://www.greatsolutions.com.br/indexint.htm"                   
   method="get">
    <h3> Enter your name</h3>
    First Name <input type="text"  name="fname"  size="30"><br>
    Last Name <input type="text" name="lname" size="30"><br>
    <a href="#" onclick="this.parentNode.submit();"> Submit here</a>
</form>

मान लीजिए कि मैं अपने नाम के साथ प्रवेश करता हूं:

मैंने getफॉर्म विधि विशेषता का उपयोग किया है क्योंकि सबमिट करने के बाद लोड किए गए पृष्ठ पर URL में सही पैरामीटर देखना संभव है।

http://www.greatsolutions.com.br/indexint.htm?fname=Paulo&lname=Buchsbaum

यह समाधान स्पष्ट रूप से किसी भी टैग पर लागू होता है जो onclickघटना या कुछ इसी तरह की घटना को स्वीकार करता है ।

thiseventचर के साथ संदर्भ को पुनर्प्राप्त करने के लिए एक उत्कृष्ट विकल्प है (सभी प्रमुख ब्राउज़रों और IE9 में उपलब्ध है) जिसे सीधे उपयोग किया जा सकता है या किसी फ़ंक्शन के तर्क के रूप में पारित किया जा सकता है।

इस स्थिति में, aसंपत्ति का उपयोग करके, लाइन के नीचे टैग के साथ लाइन को बदलें target, जो उस तत्व को इंगित करता है जिसने घटना शुरू की है।

<a href="#" onclick="event.target.parentNode.submit();"> Submit here</a>

Comments

@ नथन, मुझे लिखने का ज्यादा अभ्यास नहीं है Stackoverflow। मुझे आशा है कि आपके सुधार मुझे मेरी शैली को बेहतर बनाने में मदद करेंगे। मेरी अंग्रेजी भी अच्छी नहीं है।

— पाउलो बुचसबम

Answer 7

आप OnClick = "document.getElementById ('formID_NOT_NAME') का उपयोग कर सकते हैं। SUBMIT ()"