2012-11-21 11 views
14

मेरे पास दो एंकर हैंडलर एंकर टैग से बंधे हैं: एक फोकस और धुंध के लिए।आईओएस सफारी मोबाइल (आईफोन/आईपैड) में ब्लर इवेंट क्यों नहीं निकाला गया है?

हैंडलर डेस्कटॉप पर आग लगते हैं, लेकिन आईफोन और आईपैड में केवल फोकस सही ढंग से निकाल दिया जाता है। अगर मैं एंकर टैग के बाहर क्लिक करें (कलंक आग केवल जब मैं पेज में किसी अन्य रूप तत्वों क्लिक करें) धुंधला निकाल दिया नहीं है:

$("a").focus(function(){ 
     console.log("focus fired"); 
    }); 

    $("a").blur(function(){ 
     console.log("blur fired"); 
    }); 

HTML: एक लंगर जुड़ी किसी भी इवेंट नहीं हैं

<html> 
<form> 
    <a href="#">test link</a> 
    <div> 
    <input type="text" title="" size="38" value="" id="lname1" name="" class="text"> 
    </div> 
    <div style="padding:100px"> 
     <p>test content</p> 
    </div> 
</form> 
</html> 

उत्तर

7

हैं , आईओएस में पहली बार टैप एंकर को होवर राज्य में डाल दिया जाता है, और केंद्रित है। एक टैप दूर होवर राज्य को हटा देता है, लेकिन लिंक केंद्रित रहता है। यह डिजाइन द्वारा है। आईओएस पर किसी एप्लिकेशन को सही तरीके से नियंत्रित करने के लिए, आपको टच-आधारित ईवेंट को लागू करने और डेस्कटॉप लोगों की बजाय उन पर प्रतिक्रिया करने की आवश्यकता है।

a complete guide to using Javascript events in WebKit on iOS है।

+1

मुझे https://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html में एक और अधिक intresting चीज़ मिली, केवल तभी जब मैं केवल एंकर से क्लिक करने योग्य तत्व पर क्लिक करता हूं टैग खोया फोकस। –

+2

मैंने पोस्ट गाइड पढ़ा है और अभी भी यह नहीं देखता कि इनपुट तत्व ने फोकस खोने पर आपको कैसे पता लगाया है? क्या आप एक कोड उदाहरण पोस्ट कर सकते हैं? – ChrisFox

+0

@ChrisFox क्षमा करें, मेरे पास कोई कोड उदाहरण नहीं है। फोकस स्थानांतरित करने के लिए आपको किसी अन्य फॉर्म तत्व पर टैप करना होगा (और पिछले एक पर धुंधला ईवेंट प्राप्त करना होगा)। –

3

यह एक हैक है, लेकिन आप प्रत्येक DOM तत्व पर एक क्लिक हैंडलर पंजीकृत करके .blur को आग लग सकते हैं। यह पहले केंद्रित तत्व से फोकस हटा देता है।

$('*').click(function () { }); 
$('html').css("-webkit-tap-highlight-color", "rgba(0, 0, 0, 0)"); 

दूसरी पंक्ति तत्वों पर क्लिक होने पर हाइलाइट को हटा देती है।

मुझे पता है कि यह उप-इष्टतम है, लेकिन यह आपको जा सकता है।

2

आप टच डिवाइस के साथ काम कर रहे हैं आप touchleave या touchend जब क्षेत्र के बाहर उपयोगकर्ता क्लिक करता है संभाल करने के लिए घटना का उपयोग कर सकते हैं।

$("a").on('touchleave touchcancel', function() { 
     // do something 
}); 

इसके लिए आप के रूप में

$("a").on("click", function (e) { 
     if(e.handled !== true) { 
      e.handled = true 
     } else { 
      return false 
     } 
     // do something 
}) 
1
बाहर सबसे div में

इस प्रकार

<div onclick='click()'> 

तो एक के लिए क्लिक पर घटना सुनने के लिए आपका ध्यान समारोह अद्यतन करने की आवश्यकता काम करने के लिए जावास्क्रिप्ट

function click(){} 
संबंधित मुद्दे