में अप्रत्याशित रूप से बुलाया जा रहा है मैंने JQuery UI का उपयोग करके एक सरल ऑटो-पूर्ण नियंत्रण बनाया है। मेरे पास इनपुट फ़ील्ड के लिए एक डिफ़ॉल्ट मान है जो "अपने कीवर्ड दर्ज करें ..." पढ़ता है। मैंने फ़ोकस() ईवेंट सेट अप किया है जो इनपुट को साफ़ कर देगा जब कोई उपयोगकर्ता टाइपिंग के लिए इनपुट फ़ील्ड पर फ़ोकस सेट करता है।JQuery UI स्वत: पूर्ण फोकस() को इंटरनेट एक्सप्लोरर

आईई में जब आप टाइपिंग करते हैं और मेनू आइटम आइटम की सूची प्रदर्शित करता है, तो मेनू आइटम फोकस() से कोई आइटम चुनते समय फिर से कॉल किया जाता है। फोकस() पर यह अतिरिक्त कॉल केवल आईई में होता है। दुष्प्रभाव यह है कि चयनित मेनू आइटम को टेक्स्ट फ़ील्ड से साफ़ कर दिया गया है।

मेरे पास autocomplete.focus() ईवेंट का उपयोग करके इसका एक बहुत ही प्राचीन समाधान है। जब उपयोगकर्ता किसी चयनित मेनू आइटम पर हो जाता है तो यह ईवेंट निकाल दिया जाता है। यहां मैं एक वैश्विक बूलियन चर सेट कर सकता हूं जिसका उपयोग इनपुट फ़ील्ड पर फोकस() ईवेंट को बताने के लिए किया जा सकता है कि मेनू आइटम सक्रिय/दृश्यमान है और इस प्रकार इनपुट मान को साफ़ नहीं किया जा सकता है। यह एक हैक, ज़ाहिर है!

क्या इस समस्या का कोई विकल्प (कम हैकी!) समाधान है?

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Autocomplete demo</title> 
    <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" /> 
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> 
    <script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script> 
</head> 
<body> 
<script> 
    $(function() { 
     var availableTags = [ 
      "ActionScript", 
      "AppleScript", 
      "Asp", 
      "BASIC", 
      "C", 
      "C++", 
      "Clojure", 
      "COBOL", 
      "ColdFusion", 
      "Erlang", 
      "Fortran", 
      "Groovy", 
      "Haskell", 
      "Java", 
      "JavaScript", 
      "Lisp", 
      "Perl", 
      "PHP", 
      "Python", 
      "Ruby", 
      "Scala", 
      "Scheme" 
     ]; 
     $("#tags").autocomplete({ 
      source: availableTags, 
      focus: function (event, ui) { 
       // This event fires when an item from the menu is selected (in focus) 
       // set some variable here to tell the focus() call to the text field not to clear the value from the input field 
      }, 
     }); 

     $("#tags").focus(function() { 
      // clear the input value 
      $("#tags").val(""); 
     }); 
    }); 
</script> 

<div class="demo"> 

    <div class="ui-widget"> 
     <label for="tags">Tags: </label> 
     <input id="tags" value="Enter your keywords..." /> 
    </div> 

</div> 
</body> 
</html>

अद्यतन

प्रदान की जवाब यह अब आईई 8 & 9.

$(document).ready(function() { 
    var availableTags = [ 
     "ActionScript", 
     "AppleScript", 
     "Asp", 
     "BASIC", 
     "C", 
     "C++", 
     "Clojure", 
     "COBOL", 
     "ColdFusion", 
     "Erlang", 
     "Fortran", 
     "Groovy", 
     "Haskell", 
     "Java", 
     "JavaScript", 
     "Lisp", 
     "Perl", 
     "PHP", 
     "Python", 
     "Ruby", 
     "Scala", 
     "Scheme" 
    ]; 
    $("#tags").autocomplete({ 
     source: availableTags 
    }); 

    $("#tags").focus(function() { 
     // clear the input value 
     $("#tags").val(""); 

     return false; 
    }); 
})

स्रोत

2012-03-05 Bradley Braithwaite

में काम करता है से मदद इस समाधान करने के लिए और साथ मामूली ट्वीक के साथ:

यहाँ कोड है

हमारे पास एक समान समस्या थी और मेरा मानना है कि हमने इसे focus विधि में जोड़कर तय किया है:

$("#tags").focus(function() { 
     // clear the input value 
     $("#tags").val(""); 

     return false; 
    });

इसके अलावा, ऐसा लगता है कि आपके focus घोषणा के बाद आपके पास अतिरिक्त (पीछे) कॉमा था। शायद इसे साफ करना चाहते हैं।

अद्यतन

jsbin.com में थोड़ा अपने कोड के साथ चारों ओर खेलने के बाद, मुझे लगता है मैं IE के साथ अपने विशिष्ट मुद्दे का हल मिल गया लगता है, लेकिन मैं क्यों यह केवल में मर जाता है पर 100% नहीं हूँ अर्थात।

उदाहरण: http://jsbin.com/aqituk/2/edit#javascript,html

अंतर पूर्ण दस्तावेज तैयार करने के लिए समारोह $(function() { ... बदल रहा था, $(document).ready(function() {...

आशा इस मदद करता है!

स्रोत

2012-03-05 15:32:20 shanabus

आपके उत्तर के लिए धन्यवाद। मैंने आपके उदाहरण के अनुसार "वापसी झूठी" जोड़ने का प्रयास किया, हालांकि मुझे लगता है कि आप स्वत: पूर्ण फोकस ईवेंट की बजाय इनपुट फ़ील्ड की फ़ोकस ईवेंट में इसे जोड़ना चाहते थे? –

यह काम करता है जब यह काम करता है और जब यह IE9 – shanabus

IE9 समस्या के साथ अच्छा पकड़ नहीं है। मैं केवल आज तक संस्करण 8 तक परीक्षण कर रहा हूं। हो सकता है कि मैंने काफी अच्छी तरह से व्याख्या नहीं की लेकिन आपके समाधान में अलर्ट मेरे लिए ऑटो पूर्ण की कार्यक्षमता को प्रभावित कर रहे थे। जब मैं मेनू में किसी आइटम पर क्लिक करता हूं तो मैं [inputElement]। फ़ोकस() को आग नहीं चाहता हूं। मैं "जे" दर्ज करता हूं, "जावास्क्रिप्ट" और "जावास्क्रिप्ट" पर क्लिक करें अब टेक्स्ट फ़ील्ड का मान होना चाहिए। मैंने समाधान के साथ अपना प्रश्न अपडेट कर लिया है। मैंने मूल रूप से आपके सुझाव को tweaked, तो कृपया आप अपना जवाब अपडेट कर सकते हैं ताकि मैं स्वीकार कर सकूं? :) –

नीचे कोड के साथ अपना कोड बदलें।

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Autocomplete demo</title> 
    <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" /> 
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> 
    <script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script> 
</head> 
<body> 
<script> 
    $(function() { 
     var availableTags = [ 
      "ActionScript", 
      "AppleScript", 
      "Asp", 
      "BASIC", 
      "C", 
      "C++", 
      "Clojure", 
      "COBOL", 
      "ColdFusion", 
      "Erlang", 
      "Fortran", 
      "Groovy", 
      "Haskell", 
      "Java", 
      "JavaScript", 
      "Lisp", 
      "Perl", 
      "PHP", 
      "Python", 
      "Ruby", 
      "Scala", 
      "Scheme" 
     ]; 
     $("#tags").autocomplete({ 
      source: availableTags 
      select: function(event, ui){ 
       var yourTxt= $(this); 
       yourTxt.value = ui.item.value; 

      } 
     }); 

     $("#tags").mouseup(function() { 
      // clear the input value 
      $("#tags").val(""); 
     }); 
    }); 
</script> 

<div class="demo"> 

    <div class="ui-widget"> 
     <label for="tags">Tags: </label> 
     <input id="tags" value="Enter your keywords..."/> 
    </div> 

</div> 
</body> 
</html>

स्रोत

2013-12-30 15:35:53

मैं बस इसी मामले के लिए हल करने के लिए थक गया था। अंत में, मैंने नीचे दिखाया गया सरल समाधान लिया है:

// onload 
$('#foo').autofocus({ 
    // add options 
    disabled: true 
}); 

<input id="foo" onclick="$(this).autocomplete('enable');">

स्रोत

2015-08-26 23:57:17 user5270649

मैंने कोशिश की लेकिन 'अनकॉट टाइप एरर: $ (...)। ऑटोफोकस एक फ़ंक्शन नहीं है (...) ' –

JQuery UI स्वत: पूर्ण फोकस() को इंटरनेट एक्सप्लोरर

अद्यतन

उत्तर

संबंधित मुद्दे