<select size="2">
<option selected="selected">Input your option</option>
<option>Input your option</option>
</select>सबसे अच्छा तरीका क्या है, विकल्प को सुंदर ढंग से अचयनित करने के लिए jQuery का उपयोग करना?
<select size="2">
<option selected="selected">Input your option</option>
<option>Input your option</option>
</select>सबसे अच्छा तरीका क्या है, विकल्प को सुंदर ढंग से अचयनित करने के लिए jQuery का उपयोग करना?
जवाबों:
RemoveAttr का उपयोग करें ...
$("option:selected").removeAttr("selected");या प्रोप
$("option:selected").prop("selected", false).val([])या तो हैं .prop("selected", false)- या नीचे स्क्रॉल करें।
$("option:selected").prop("selected", false)कभी-कभी काम नहीं कर रहा है। (jquery v1.4.2 के साथ क्रोम ब्राउज़र में काम नहीं कर रहा है)
यहाँ बहुत सारे उत्तर हैं लेकिन दुर्भाग्य से वे सभी काफी पुराने हैं और इसलिए उन पर निर्भर हैं attr/ removeAttrजो वास्तव में जाने का रास्ता नहीं है।
@coffeeyesplease सही उल्लेख करता है कि एक अच्छा, क्रॉस-ब्राउज़र समाधान का उपयोग करना है
$("select").val([]);एक और अच्छा क्रॉस-ब्राउज़र समाधान है
// Note the use of .prop instead of .attr
$("select option").prop("selected", false);आप इसे यहां एक आत्म-परीक्षण चलाने के लिए देख सकते हैं । IE 7/8/9, FF 11, Chrome 19 पर परीक्षण किया गया।
Array.indexOfआईई 9 के लिए एक पॉलीफ़िल की आवश्यकता है (या आप किसी भी जेएस पुस्तकालयों को प्रदान करने वाले किसी भी समकक्ष विधि का उपयोग कर सकते हैं)।
$('#select').val([]);? दुर्भाग्य से, यह selected="selected"विशेषता को दूर नहीं करता है । वह गलत डेटा पोस्ट करना समाप्त कर सकता है। मैं इस दृष्टिकोण की सिफारिश नहीं करता हूं!
यह पूछे जाने के बाद से एक समय हो गया है, और मैंने पुराने ब्राउज़रों पर इसका परीक्षण नहीं किया है, लेकिन यह मुझे बहुत सरल उत्तर लगता है
$("#selectID").val([]);.val () सेलेक्ट के लिए भी काम करता है http://api.jquery.com/val/
$("select option").prop("selected", false);सार्वभौमिक रूप से (बहु और एकल चयनों पर) काम करता है।
$('select').val('')मैं बस चयन पर इस का इस्तेमाल किया और यह चाल चली।
मैं jQuery 1.7.1 पर हूं ।
उत्तर अब तक केवल IE6 / 7 में कई चयनों के लिए काम करते हैं; अधिक सामान्य गैर-बहु चयन के लिए, आपको उपयोग करने की आवश्यकता है:
$("#selectID").attr('selectedIndex', '-1');यह फ्लाईफिश 64 द्वारा लिंक किए गए पोस्ट में बताया गया है। यदि आप इसे देखते हैं, तो आप देखेंगे कि कैसे 2 मामले हैं - बहु / गैर-बहु। पूर्ण समाधान के लिए दोनों का जप करने से कुछ नहीं होता है:
$("#selectID").attr('selectedIndex', '-1').find("option:selected").removeAttr("selected");ओह जीकरी।
चूंकि अभी तक एक देशी जावास्क्रिप्ट दृष्टिकोण है, इसलिए मुझे एक प्रदान करने की आवश्यकता महसूस होती है।
var select = document.querySelector('select'); //hopefully you'll use a better selector query
select.selectedIndex = 0; // or -1, 0 sets it to first option, -1 selects no optionsऔर बस आपको यह दिखाने के लिए कि यह कितना तेज है: बेंचमार्क
एक त्वरित Google ने इस पोस्ट को पाया जो यह बताता है कि IE में एकल और एकाधिक चयन सूची दोनों के लिए आपको क्या करना है। समाधान बहुत ही सुंदर लगता है:
$('#clickme').click(function() {
$('#selectmenu option').attr('selected', false);
}); $(option).removeAttr('selected') //replace 'option' with selected option's selectorसमाधान के लिए बहुत बहुत धन्यवाद।
एकल विकल्प कॉम्बो सूची के लिए समाधान पूरी तरह से काम करता है। मैंने कई साइटों पर खोज करने के बाद यह पाया।
$("#selectID").attr('selectedIndex', '-1').children("option:selected").removeAttr("selected");$("option:selected").attr("selected", false);आमतौर पर जब मैं एक चयन मेनू का उपयोग करता हूं, तो प्रत्येक विकल्प के साथ एक मूल्य जुड़ा होता है। उदाहरण के लिए
<select id="nfl">
<option value="Bears Still...">Chicago Bears</option>
<option selected="selected" value="Go Pack">Green Bay Packers</option>
</select>
console.log($('#nfl').val()) logs "Go Pack" to the console
Set the value to an empty string $('#nfl').val("")
console.log($('#nfl').val()) logs "" to the consoleअब यह विकल्प से चयनित विशेषता को नहीं हटाता है, लेकिन मैं वास्तव में चाहता हूं कि मूल्य है।
अपने चयन में एक आईडी सेट करें, जैसे:
<select id="foo" size="2">
तो आप का उपयोग कर सकते हैं:
$("#foo").prop("selectedIndex", 0).change();