दिलचस्प पोस्ट
JQuery के सत्यापन प्लगइन के साथ बूटस्ट्रैप 3 jqGrid: संपादन करते समय फॉर्म फ़ील्ड अक्षम करें कैसे div तत्व को धुंधला करने के लिए? स्टार्टअप पर ईजेबी / लोड ईजेबी के उत्सुक / ऑटो लोडिंग (जेबीस पर) सभी कम केस होने के लिए JavaScript स्ट्रिंग कन्वर्ट करें? आप एक UIButton में बहु-पंक्ति पाठ कैसे जोड़ सकते हैं? एप्लिकेशन प्रारंभ करने में विफल रहा क्योंकि यह क्यू प्लस प्लगइन "विंडो" ES6 टेम्पलेट लिटरल्स के लिए निष्पादन हटाएं SQL सर्वर PIVOT शायद? हिब्रू पाठ के लिए टेक्स्टव्यू के साथ एंड्रॉइड सेटिंग? मैं .NET डेटटाइम में एक Excel सीरियल तिथि नंबर कैसे बदलूं? गलत IO क्रियाएं putStr और getLine का उपयोग करते हुए ListView में एकाधिक आइटम का चयन करना SASS और ब्रेकपॉइंट का उपयोग करते हुए मीडिया प्रश्नों को मर्ज करना (उत्तर-के) कैसे ओवरराइड करना महत्वपूर्ण है?

मोबाइल सफारी: इनपुटफील्ड पर जावास्क्रिप्ट फोकस () विधि केवल क्लिक के साथ काम करती है?

मुझे इस समस्या का समाधान नहीं मिल सकता है

मेरे पास इस तरह एक सरल इनपुट फ़ील्ड है

<div class="search"> <input type="text" value="yu no work"/> </div>​ 

और मैं फ़ंक्शन के अंदर focus() करने की कोशिश कर रहा हूं। तो एक यादृच्छिक समारोह के अंदर (कोई फ़र्क नहीं पड़ता कि फ़ंक्शन क्या है) मेरे पास यह रेखा है …

 $('.search').find('input').focus(); 

यह हर डेस्कटॉप पर बस ठीक काम करता है।

हालांकि यह मेरे आईफोन पर काम नहीं करता है फ़ील्ड फ़ोकस नहीं हो रही है और कीबोर्ड मेरे आईफ़ोन पर नहीं दिखाया गया है।

परीक्षण के प्रयोजनों के लिए और आप लोगों को समस्या दिखाने के लिए मैंने एक त्वरित नमूना किया:

 $('#some-test-element').click(function() { $('.search').find('input').focus(); // works well on my iPhone - Keyboard slides in }); setTimeout(function() { //alert('test'); //works $('.search').find('input').focus(); // doesn't work on my iPhone - works on Desktop }, 5000);​ 

कोई भी विचार क्यों focus() मेरे iPhone पर टाइमआउट फ़ंक्शन के साथ काम नहीं करेगा

लाइव उदाहरण देखने के लिए, अपने iPhone पर इस बेला का परीक्षण करें http://jsfiddle.net/Hc4sT/

अद्यतन करें:

मैंने सटीक एक ही मामला बनाया है क्योंकि मैं वर्तमान में अपने मौजूदा प्रोजेक्ट में सामना कर रहा हूं।

मेरे पास एक चयन-बक्से होता है – जब "बदले" – इनपुट फ़ील्ड पर फ़ोकस सेट करें और स्लाइड- Iphone या अन्य मोबाइल उपकरणों पर kexboard में मुझे पता चला कि फ़ोकस () ठीक से सेट है लेकिन कीबोर्ड दिखाई नहीं देता। मुझे दिखाने के लिए कीबोर्ड की आवश्यकता है

मैंने यहां testfiles यहां अपलोड किया है http://cl.ly/1d210x1W3Y3W … यदि आप इसे iPhone पर जांचते हैं तो आप देख सकते हैं कि कीबोर्ड स्लाइड-इन नहीं करता है

वेब के समाधान से एकत्रित समाधान "मोबाइल सफारी: इनपुटफील्ड पर जावास्क्रिप्ट फोकस () विधि केवल क्लिक के साथ काम करती है?"

दरअसल, दोस्तों, एक रास्ता है। मैं ताकतवर से http://forstartersapp.com (यह iPhone या iPad पर आज़माएं) के लिए यह आंकड़ा है।

मूल रूप से, टचस्क्रीन उपकरणों पर सफारी कष्टप्रद होता है जब यह टेक्स्ट बॉक्स को focus() करने के लिए आता है। यहां तक ​​कि कुछ डेस्कटॉप ब्राउज़र बेहतर तरीके से करते हैं यदि आप click().focus() करते click().focus() । लेकिन टचस्क्रीन उपकरणों पर सफारी के डिज़ाइनर यह मानते हैं कि जब उपयोगकर्ता कीबोर्ड जारी रखता है, तब वे परेशान होते हैं, इसलिए उन्होंने निम्नलिखित स्थितियों पर ध्यान केंद्रित किया:

1) उपयोगकर्ता ने कहीं क्लिक किया और क्लिक ईवेंट को निष्पादित करते समय focus() को बुलाया गया था यदि आप एक AJAX कॉल कर रहे हैं, तो आपको इसे तुल्यकालिक रूप से करना होगा , जैसे कि उदासीन (लेकिन अभी भी उपलब्ध) $.ajax({async:false}) विकल्प में jQuery।

2) इसके अलावा – और इसने मुझे कुछ समय के लिए व्यस्त रखा – focus() अभी भी काम करने के लिए प्रतीत नहीं होता अगर कोई अन्य टेक्स्टबॉक्स उस समय केंद्रित होता है। मेरे पास एक "गो" बटन था जो touchstart करता था, इसलिए मैंने गो बटन के touchstart घटना पर पाठ बॉक्स को touchstart कोशिश की, लेकिन यह कि बस कुंजीपटल गायब हो गया और व्यूपोर्ट को स्थानांतरित कर दिया, इससे पहले कि मुझे गो पर क्लिक पूरा करने का मौका मिला बटन। आखिरकार मैंने touchend बटन के touchend ईवेंट पर पाठ बॉक्स को धुंधला करने की कोशिश की, और यह एक जादू की तरह काम किया!

जब आप # 1 और # 2 को एक साथ रखते हैं, तो आपको एक जादुई परिणाम मिलता है जो आपके पासवर्ड क्षेत्रों में फ़ोकस डालकर, और अपने स्थानीय रूप से अधिक देशी महसूस करने के लिए, सभी लॉग-इन फ़ॉर्म को सभी भद्दा वेब लॉगिन रूपों के अलावा सेट कर देगा। का आनंद लें! 🙂

मेरे पास उस आइकन के साथ एक खोज फ़ॉर्म है, जो क्लिक करते समय पाठ को साफ़ करता है। हालांकि, समस्या (मोबाइल और टैबलेट पर) यह थी कि कुंजीपटल गिर / छिपाएगा, क्योंकि click ईवेंट हटाए गए focus को input से हटा दिया गया था।

करीब आइकन के साथ पाठ खोज इनपुट

लक्ष्य : खोज फ़ॉर्म को साफ करने के बाद (एक्स-आइकन पर टैपिंग / टैपिंग) कीबोर्ड को दृश्यमान रखें !

इसे पूरा करने के लिए, इस तरह की घटना पर stopPropagation() लागू करें:

 function clear ($event) { $event.preventDefault(); $event.stopPropagation(); self.query = ''; $timeout(function () { document.getElementById('sidebar-search').focus(); }, 1); } 

और एचटीएमएल फॉर्म:

 <form ng-controller="SearchController as search" ng-submit="search.submit($event)"> <input type="search" id="sidebar-search" ng-model="search.query"> <span class="glyphicon glyphicon-remove-circle" ng-click="search.clear($event)"> </span> </form> 

अद्यतन करें

मैंने यह भी कोशिश की, लेकिन कोई फायदा नहीं हुआ:

 $(document).ready(function() { $('body :not(.wr-dropdown)').bind("click", function(e) { $('.test').focus(); }) $('.wr-dropdown').on('change', function(e) { if ($(".wr-dropdow option[value='/search']")) { setTimeout(function(e) { $('body :not(.wr-dropdown)').trigger("click"); },3000) } }); 

});

मैं समझता हूं कि आप क्यों कहते हैं कि यह काम नहीं कर रहा है क्योंकि आपका JSFiddle अभी ठीक काम कर रहा है, लेकिन यह मेरा सुझाव वैसे भी है …

अपने क्लिक ईवेंट पर अपने SetTimeOut फ़ंक्शन में कोड की इस पंक्ति को आज़माएं:

 document.myInput.focus(); 

my इनपुट इनपुट टैग के नाम विशेषता से संबंधित है

 <input name="myInput"> 

और फ़ील्ड को धुंधला करने के लिए इस कोड का उपयोग करें:

 document.activeElement.blur(); 

मैं इसे निम्न कोड के साथ काम करने में कामयाब रहा हूं:

 event.preventDefault(); timeout(function () { $inputToFocus.focus(); }, 500); 

मैं AngularJS का उपयोग कर रहा हूं, इसलिए मैंने एक ऐसी निदेशिका बनाई है जो मेरी समस्या का समाधान करती है:

निर्देशक:

 angular.module('directivesModule').directive('focusOnClear', [ '$timeout', function (timeout) { return { restrict: 'A', link: function (scope, element, attrs) { var id = attrs.focusOnClear; var $inputSearchElement = $(element).parent().find('#' + id); element.on('click', function (event) { event.preventDefault(); timeout(function () { $inputSearchElement.focus(); }, 500); }); } }; } ]); 

निर्देश कैसे उपयोग करें:

 <div> <input type="search" id="search"> <i class="icon-clear" ng-click="clearSearchTerm()" focus-on-clear="search"></i> </div> 

ऐसा लगता है कि आप jQuery का प्रयोग कर रहे हैं, इसलिए मुझे नहीं पता कि निर्देश किसी भी मदद से है।

यह समाधान अच्छी तरह से काम करता है, मैंने अपने फोन पर परीक्षण किया है:

 document.body.ontouchend = function() { document.querySelector('[name="name"]').focus(); }; 

का आनंद लें

मुझे हाल ही में एक ही समस्या का सामना करना पड़ा। मुझे एक समाधान मिला जो जाहिरा तौर पर सभी उपकरणों के लिए काम करता है आप async फ़ोकस प्रोग्रामेटिक रूप से नहीं कर सकते हैं, लेकिन जब आप कुछ अन्य इनपुट पहले ही केंद्रित है, तो आप अपने लक्ष्य इनपुट पर ध्यान केंद्रित कर सकते हैं। तो आपको क्या करना है, बनाने, छिपाना, DOM को संलग्न करना और ट्रिगर ईवेंट पर नकली इनपुट पर ध्यान केंद्रित करना और, जब एएससीएनसी कार्य पूर्ण हो जाता है, तो लक्ष्य इनपुट पर फिर से फ़ोकस करें। यहां एक उदाहरण स्निपेट है – इसे अपने मोबाइल पर चलाएं

संपादित करें:

यहाँ एक ही कोड के साथ एक बेला है जाहिर है आप मोबाइल पर संलग्न स्निपेट नहीं चला सकते (या मैं कुछ गलत कर रहा हूं)।

 var $triggerCheckbox = $("#trigger-checkbox"); var $targetInput = $("#target-input"); // Create fake & invisible input var $fakeInput = $("<input type='text' />") .css({ position: "absolute", width: $targetInput.outerWidth(), // zoom properly (iOS) height: 0, // hide cursor (font-size: 0 will zoom to quarks level) (iOS) opacity: 0, // make input transparent :] }); var delay = 2000; // That's crazy long, but good as an example $triggerCheckbox.on("change", function(event) { // Disable input when unchecking trigger checkbox (presentational purpose) if (!event.target.checked) { return $targetInput .attr("disabled", true) .attr("placeholder", "I'm disabled"); } // Prepend to target input container and focus fake input $fakeInput.prependTo("#container").focus(); // Update placeholder (presentational purpose) $targetInput.attr("placeholder", "Wait for it..."); // setTimeout, fetch or any async action will work setTimeout(function() { // Shift focus to target input $targetInput .attr("disabled", false) .attr("placeholder", "I'm alive!") .focus(); // Remove fake input - no need to keep it in DOM $fakeInput.remove(); }, delay); }); 
 label { display: block; margin-top: 20px; } input { box-sizing: border-box; font-size: inherit; } #container { position: relative; } #target-input { width: 250px; padding: 10px; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <div id="container"> <input type="text" id="target-input" placeholder="I'm disabled" /> <label> <input type="checkbox" id="trigger-checkbox" /> focus with setTimetout </label> </div> 

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