मुझे नया <datalist> आमतौर पर बहुत उपयोगी लगता है, लेकिन मुझे लगता है कि सुझाव पर्याप्त दिखाई नहीं दे रहे हैं। क्या जावास्क्रिप्ट का उपयोग करके डातालिस्ट सुझावों के प्रदर्शन को ट्रिगर करने का कोई तरीका है?जावास्क्रिप्ट का उपयोग करके डातालिस्ट सुझाव कैसे दिखाएं?
एक उदाहरण के रूप में, मैं एक <input type="number"> (jsFiddle) पर एक DataList है।
<label>
Enter a Fibonacci number:
<input type="number" list="fibonacci" min="0" id="myinput">
</label>
<datalist id="fibonacci">
<option value="0">
<option value="1">
<option value="2">
<option value="3">
<option value="5">
<option value="8">
<option value="13">
<option value="21">
</datalist>
<button type="button" id="show-suggestions">Show suggestions</button>
<script>
$('#show-suggestions').click(function() {
// .showSuggestions() does not exist.
// I'd like it to display the suggested values for the input field.
$('#myinput').showSuggestions();
});
</script>
क्रोम में, सुझाव की पूरी सूची दिखाया गया है केवल जब इनपुट खाली है, पहले से ही ध्यान केंद्रित है, और उपयोगकर्ता तो इनपुट पर क्लिक करता है। नीचे तीर सुझाव नहीं दिखाता है - यह केवल मूल्य को कम करता है।
मैं सुझावों को और अधिक दृश्यमान बनाना चाहता हूं। एक उदाहरण के रूप में मैंने एक बटन जोड़ा है जो सुझावों की सूची खोलने वाला है। मैं ऑनक्लिक-हैंडलर में क्या डालूं?
मैंने क्रोम, jQuery और इस उदाहरण में एक संख्या इनपुट का उपयोग किया है, लेकिन मैं उन सभी से स्वतंत्र जेनेरिक समाधान पसंद करूंगा।