में मोबाइल सफारी
document.getElementById("test_label").onclick = function() {};
तरह परिभाषित किया गया है समस्या का हल।
यह पूर्ण स्रोत कोड है।
<body>
<input type="checkbox" id="test" name="test">
<label for="test" id="test_label">This is the label</label>
<script>
document.getElementById("test_label").onclick = function() {};
</script>
</body>
क्या आपको पता है कि यह क्यों काम करता है?
ऐसा लगता है कि आपको आईओएस सफारी में एक बग मिली है। बधाई! बग ढूंढना और रिपोर्ट करना नशे की लत है।
आप https://bugreport.apple.com/ पर ऐप्पल को यह और अन्य बग की रिपोर्ट कर सकते हैं। ऐप्पल तुरंत पालन नहीं कर सकता है, लेकिन भविष्य में किसी बिंदु पर उन्हें आपको सूचित करना चाहिए कि यह मौजूदा बग का डुप्लिकेट था, कि वे इसे एक बग नहीं मानते हैं, या (यदि आप भाग्यशाली हैं) तो आपको परीक्षण करना चाहिए यह फिर से आईओएस के एक नए संस्करण में।
इस बीच, इस कार्यवाही पर पकड़ लें - आपको इसकी आवश्यकता होगी।
यय! मुझे सफारी पसंद है :) –
वास्तव में? आपको वेब डेवलपर नहीं होना चाहिए;) – DarkNeuron
हम इस वैश्विक समस्या जावास्क्रिप्ट फ़ाइल में कोड की इस एकल पंक्ति को जोड़कर इस मुद्दे के आसपास काम करने में सक्षम थे।
$('label').click(function() {});
हम xui सूक्ष्म js पुस्तकालय का उपयोग कर रहे हैं और उस लाइन बस सभी label तत्वों के लिए एक खाली क्लिक हैंडलर जुड़ जाता है। किसी कारण से, यह जादुई रूप से मोबाइल सफारी पर इस मुद्दे को हल करता है।
आईओएस 7 पर मुझे अभी भी इसी तरह के मुद्दों का सामना करना पड़ रहा है। 'लेबल' टैग पर आग लगाने के लिए 'क्लिक' नहीं मिल सका। विचित्र और बहुत निराशाजनक। – Dex
यदि पहले से ही एक ऑनक्लिक विशेषता है, तो उसे इसे ओवरराइड नहीं करना चाहिए और मेरे परीक्षण में, यह काम करता है (ऑनक्लिक विशेषता) और चेकबॉक्स पर भी क्लिक किया। तो मेरे समाधान है:
<script type="text/javascript">
var labels = document.getElementsByTagName("LABEL");
var labels_l = labels.length;
for(var l = 0; l < labels_l; l++){
if(labels[l].hasAttribute("for") && (!labels[l].hasAttribute("onclick"))){
labels[l].onclick = function() {};
}
}
</script>
मुझे पता है यह वास्तव में अच्छा मार्कअप नहीं है: मैं बस onclick प्रत्येक लेबल पर इस onclick="" की तरह एक खाली hardcoded। यह एक रैपिंग लेबल पर काम करता है:
<label for="myID" onclick="">
<input type="checkbox" id="myID" name="myNAME">
Check to check
</label>
रैपिंग लेबल पर यह वैसे भी काम करता है, हैंडलर आवश्यक नहीं है। –
आईफ़ोन सफारी पर, यह तुरंत काम नहीं करता था। मुझे onclick = ";" सेट करना पड़ा –
आईओएस 7 में, यह समस्या अभी भी मेरे लिए काम कर रहे किसी भी कामकाज के बिना बनी हुई है।
मेरे समाधान touchend साथ click घटना गठबंधन करने के लिए किया गया था:
var handler = function(e) { /* do stuff */ };
$("ol input[type=checkbox] ~ label")
.on('touchend', handler)
.on('click', handler);
इस JQuery के अंक में कुछ उपयोगी जानकारी: http://bugs.jquery.com/ticket/5677 विशेष रूप से हिस्सा जहां लिखा है कि तकनीकी रूप से वहाँ मोबाइल पर कोई click घटना है।
ऑनक्लिक विशेषता जोड़ने से समस्या ठीक हो जाएगी।
<label for="test" id="test_label" onclick="">
FastClick उपयोग करने वाले लोग:
उपयोग इस सीएसएस: https://github.com/ftlabs/fastclick/issues/60
और इस codepen: http://codepen.io/visnup/pen/XJNvEq
GENIOUS !!!!!!!! – Tukkan
इस बारे में नहीं सोचा था, तीसरे पक्ष ने इस हाइब्रिड ऐप को विकसित किया था। Fastclick –
मैं बस अपना समान समस्या हल
label > * {
display: block;
pointer-events: none;
}
यह समस्या दिखाई दे इस तरह:
input {
position: absolute;
width: 120px; // size of my image
height: 100px; // size of my image
opacity: 0;
display: inherit; // Because i'm hidding it on other resolutions
}
<label for="myID" onclick="">
<input type="checkbox" id="myID" name="myNAME">
<span class="name-checkbox"> My name for my checkbox </span>
<span class="some-info">extra informations below</span>
</label>
लेबल टैग पर हर जगह iOS पर नल सक्षम करने के लिए, आप इसके प्रत्यक्ष बच्चों (इनपुट उम्मीद), सूचक-घटनाओं के लिए जोड़ने की जरूरत: कोई नहीं;
.name-checkbox, .some-info {
pointer-events: none;
}
का उपयोग किया है मैं इसे पूरे दिन देख रहा हूं। धन्यवाद! –
कुछ वास्तव में अजीब व्यवहार मेरे लिए हो रहा है जहां उपरोक्त में से कोई भी इसे ठीक नहीं करेगा। यदि मैंने लेबल तत्व के अंदर टेक्स्ट या छवियां रखी हैं, तो उस तत्व पर क्लिक करने से काम नहीं हुआ। हालांकि जब मैंने लेबल में मार्जिन और पैडिंग जोड़ा, मार्जिन या पैडिंग पर क्लिक किया लेकिन पाठ/छवियों पर काम नहीं किया। तो मैंने जो किया वह लेबल को 100% डब्ल्यू 100% एच पूरी तरह से मेरे पाठ & छवियों पर केंद्रित किया गया था।
<div class="wrapper">
<label class="label-overlay" for="file"></label>
<img src="something.png">
<p>Upload File</p>
<input type="file" name="file">
</div>
<style>
.wrapper{display:inline-block;}
.label{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer;}
</style>
क्या आप अपना एचटीएमएल पोस्ट कर सकते हैं? क्या यह '<लेबल के लिए =" कुछ आईडी "> यहां<इनपुट आईडी =" कुछ आईडी "... />' – mplungjan
प्रश्न के लिए धन्यवाद। बग एक कामकाज की तलाश में था। इस ऑनक्लिक ने मुझे बचाया :) यदि आपने https://bugreport.apple.com/ में एक बग दायर की है, तो हमें बताएं कि उन्होंने आपको क्या उत्तर दिया है। – RaphaelDDL
[लेबल तत्व के कर्सर विशेषता को पॉइंटर पर सेट करें] (http://stackoverflow.com/a/5560077) #wtf –