好的,这里是:需要过滤掉重复项并能够删除添加到选择框的值。
Number: <input type="text" name="number" />
<br />
<!-- Clicking the button should add an option w/ the value being the text displayed -->
<button type="button">Add</button>
<br />
<Select id="mySelect" size="9"></Select>
<br />
<!-- Display only if SELECT box has a value -->
<button type="button" hidden="hidden">Remove</button>
我看过这个线程 https://stackoverflow.com/questions/47824/using-core-jquery-how-do-you-remove-all-the-options-of-a-select-box-then-add-on但仍然缺少一些东西。
我不太清楚你在问什么,所以澄清一下会很有帮助。这是我对您所寻找的内容的破解:
JavaScript
<script type="text/javascript" charset="utf-8">
$( function() {
// Add number from <input> as an <option> to the <select>
$('#add_number').click( function() {
// Get Number from <input>
var numberToAdd = $('#number_to_add').val();
// Make sure it's not a duplicate; if so, don't add
var match = false;
$('#mySelect option').each( function() {
if (numberToAdd == this.value) match = true;
});
if (match) return false;
// Add the number to the <select>
$('#mySelect').append(
$('<option></option>').html(numberToAdd).val(numberToAdd)
);
// Show the remove button
$('#remove_selected').show();
return false;
});
// Remove the currently selected <option> in the <select>
$('#remove_selected').click( function() {
$('#mySelect option:selected').remove();
return false;
});
})
</script>
HTML
<form action="#">
<p>
Number: <input type="text" name="number_to_add" id="number_to_add" />
<button id="add_number" type="button">Add</button>
</p>
<p>
<select id="mySelect" size="9"></select>
<button id="remove_selected" type="button" style="display:none;">Remove</button>
</p>
</form>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)