Kako s pomočjo jedra jQueryja odstranite vse možnosti izbirnega polja, nato dodate eno možnost in jo izberete?
Moje izbirno polje je naslednje.
<Select id="mySelect" size="9"> </Select>
EDIT: Naslednja koda je bila v pomoč pri veriženju. Vendar (v Internet Explorerju) .val('whatever')
ni izbral dodane možnosti. (Uporabil sem isto 'vrednost' v .append
in .val
.)
$('#mySelect').find('option').remove().end()
.append('<option value="whatever">text</option>').val('whatever');
EDIT: Da bi posnemal to kodo, uporabljam naslednjo kodo, kadar koli se stran/obrazec ponastavi. To polje za izbiro je zapolnjeno z nizom radijskih gumbov. .focus()
je bil bližje, vendar se možnost ni prikazala kot izbrana, kot se pri .selected= "true"
. Z mojo obstoječo kodo ni nič narobe - samo poskušam se naučiti jQuery.
var mySelect = document.getElementById('mySelect');
mySelect.options.length = 0;
mySelect.options[0] = new Option ("Foo (only choice)", "Foo");
mySelect.options[0].selected="true";
EDIT: izbrani odgovor je bil blizu temu, kar sem potreboval. To mi je pomagalo:
$('#mySelect').children().remove().end()
.append('<option selected value="whatever">text</option>') ;
Toda oba odgovora sta me pripeljala do moje končne rešitve..
Ne vem natančno, kaj mislite s "dodaj eno in jo izberi", saj bo tako ali tako privzeto izbrana. Če pa bi jih dodali več, bi bilo to bolj smiselno. Kako bi bilo na primer:
$('select').children().remove();
$('select').append('<option id="foo">foo</option>');
$('#foo').focus();
Odgovor na "EDIT": Ali lahko pojasnite, kaj mislite s "To izbirno polje je zapolnjeno z nizom radijskih gumbov"? Element <select>
ne more (zakonito) vsebovati elementov <input type="radio">
.
Zahvaljujoč odgovorom, ki sem jih prejel, mi je uspelo ustvariti nekaj podobnega, kar ustreza mojim potrebam. Moje vprašanje je bilo nekoliko dvoumno. Zahvaljujem se vam za nadaljnje informacije. Moj zadnji problem sem rešil tako, da sem v možnost, ki sem jo želel izbrati, vključil "izbrano".
$(function() {
$('#mySelect').children().remove().end().append('<option selected value="One">One option</option>') ; // clear the select box, then add one option which is selected
$("input[name='myRadio']").filter( "[value='1']" ).attr( "checked", "checked" ); // select radio button with value 1
// Bind click event to each radio button.
$("input[name='myRadio']").bind("click",
function() {
switch(this.value) {
case "1":
$('#mySelect').find('option').remove().end().append('<option selected value="One">One option</option>') ;
break ;
case "2":
$('#mySelect').find('option').remove() ;
var items = ["Item1", "Item2", "Item3"] ; // Set locally for demo
var options = '' ;
for (var i = 0; i < items.length; i++) {
if (i==0) {
options += '<option selected value="' + items[i] + '">' + items[i] + '</option>';
}
else {
options += '<option value="' + items[i] + '">' + items[i] + '</option>';
}
}
$('#mySelect').html(options); // Populate select box with array
break ;
} // Switch end
} // Bind function end
); // bind end
}); // Event listener end
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>One<input name="myRadio" type="radio" value="1" /></label>
<label>Two<input name="myRadio" type="radio" value="2" /></label>
<select id="mySelect" size="9"></select>