2013-04-29 9 views
38

में काम नहीं करता मैं एक हाइपरलिंक टैग के अंदर के साथ एक <button> है, इस तरह दिखता है:नेस्टिंग <a><button> अंदर फ़ायरफ़ॉक्स

<button class="btn"><a href="#"></a></button> 

यह क्रोम और सफारी में अच्छी तरह से काम नहीं, बल्कि Firefox में काम नहीं करता (वर्क 20 परीक्षण)।

क्या गलत है?

+3

आपके पास ऐसा कोड क्यों होगा? एक बटन टैग के अंदर एक एंकर होने के नाते सही HTML afaik नहीं है। बटन बटन की तरह दिखने के लिए एंकर टैग को बस स्टाइल करना बेहतर लगेगा और बटन टैग को पूरी तरह से छुटकारा पाएं। –

+1

hahahahahah ... मैंने पहले इसके बारे में क्यों नहीं सोचा था: पी, महीने की तरह कोडिंग कर रहे थे: एस – cjmling

+4

हाँ, बूटस्ट्रैप एंकर टैग पर सभी "बीटीएन" वर्गों को स्वीकार करने में काफी खुश है जैसा मैंने दिखाया है नीचे मेरा जवाब :) –

उत्तर

43

यह सब ब्राउज़र में काम करने के लिए, फ़ायरफ़ॉक्स भी आप

<a href="#"><button class="btn"></button></a> 

करने के लिए या के रूप में बूटस्ट्रैप के मामले में बिली मोट ने सुझाव दिया <button> की कोई आवश्यकता नहीं तुम सिर्फ

कर सकता है इसे बदलने के लिए है
<a href="#" class="btn">GO</a> 
+2

सही, लेकिन एफवाईआई - बूटस्ट्रैप में बटन समूह का उपयोग करते समय पहला विकल्प शैलियों को तोड़ देता है। :( – Mark

+0

यह खतरनाक आदमी है .... – HussienK

+0

@ हुसियनके लेकिन क्यों? – thefromanguard

17

शायद बेहतर बस यह करने के लिए:

<a href="#" class="btn">Go!</a> 
+0

एंकर को छोड़कर बटन के रूप में पूरी तरह से कीबोर्ड-नेविगेट नहीं हैं। – jtheletter

3

यह समस्या एफएफ में हो रहा है और आईई (< 10)। ब्राउजर को लिंक बटन पसंद नहीं है जब इसे एक लिंक के रूप में उपयोग किया जाता है।

बूटस्ट्रैप में त्वरित समाधान का उपयोग करना और बीटीएन बीटीएन-डिफ़ॉल्ट (या बटन शैली की अपनी पसंद) का एक वर्ग देना है।

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

0

आप HTML संरचना को बदलने के बजाय बस एक ऑनक्लिक विधि का उपयोग कर सकते हैं, अगर आप अपनी संरचना को बदल नहीं सकते हैं जो आपको बदलने की अनुमति नहीं देता है (उदाहरण के लिए बूटस्ट्रैप घटक सूची-समूह के रूप में, यह मेरा मामला है) और मुख्य रूप से यदि आप एक बटन के अंदर दो या दो से अधिक लिंक रखना चाहते हैं:

<button class="btn"><a onclick="location.replace('YOUR_URL_HERE')"></a></button> 
संबंधित मुद्दे