Какой язык? Почему вы хотите использовать регулярное выражение?
answer = yourString.Replace( "boy", "" );
То же, что и другие ответы, в стиле jQuery:
$.each(selectValues, function(key, value) {
$('#mySelect')
.append($("<option></option>")
.attr("value",key)
.text(value));
});
Вы можете просто перебрать массив json с помощью следующего кода
$('<option/>').attr("value","someValue").text("Option1").appendTo("#my-select-id");
Я решил перезвонить немного.
multiple
при добавлении дополнительных опций
// objects as value/desc
let selectValues = {
"1": "test 1",
"2": "test 2",
"3": "test 3",
"4": "test Four"
};
//use div here as using "select" mucks up the original selected value in "mySelect"
let opts = $("<div />");
let opt = {};
$.each(selectValues, function(value, desc) {
opts.append($('<option />').prop("value", value).text(desc));
});
opts.find("option").appendTo('#mySelect');
// array of objects called "options" in an object
let selectValuesNew = {
options: [{
value: "1",
description: "2test 1"
},
{
value: "2",
description: "2test 2",
selected: true
},
{
value: "3",
description: "2test 3"
},
{
value: "4",
description: "2test Four"
}
]
};
//use div here as using "select" mucks up the original selected value
let opts2 = $("<div />");
let opt2 = {}; //only append after adding all options
$.map(selectValuesNew.options, function(val, index) {
opts2.append($('<option />')
.prop("value", val.value)
.prop("selected", val.selected)
.text(val.description));
});
opts2.find("option").appendTo('#mySelectNew');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="mySelect">
<option value="" selected="selected">empty</option>
</select>
<select id="mySelectNew" multiple="multiple">
<option value="" selected="selected">2empty</option>
</select>
Поскольку JQuery append
может принимать массив в качестве аргумента, я удивлен, что никто не предлагал сделать его однострочным с map
$('#the_select').append(['a','b','c'].map(x => $('<option>').text(x)));
или reduce
['a','b','c'].reduce((s,x) => s.append($('<option>').text(x)), $('#the_select'));
] Существует проблема с сортировкой этого решения в Chrome (jQuery 1.7.1) (Chrome сортирует свойства объекта по имени / номеру?) Поэтому, чтобы сохранить порядок (да, это объект злоупотребляет), я изменил это:
optionValues0 = {"4321": "option 1", "1234": "option 2"};
к этому
optionValues0 = {"1": {id: "4321", value: "option 1"}, "2": {id: "1234", value: "option 2"}};
и тогда $ .each будет выглядеть так:
$.each(optionValues0, function(order, object) {
key = object.id;
value = object.value;
$('#mySelect').append($('<option>', { value : key }).text(value));
});
var list = $("#selectList");
$.each(items, function(index, item) {
list.append(new Option(item.text, item.value));
});
var list = document.getElementById("selectList");
for(var i in items) {
list.add(new Option(items[i].text, items[i].value));
}
Будьте предупреждены ... Я использую jQuery Mobile 1.0b2 с PhoneGap 1.0.0 на телефоне Android 2.2 (Cyanogen 7.0.1) (T-Mobile G2) и не могу заставить работать метод .append (). все. Мне пришлось использовать .html () следующим образом:
var options;
$.each(data, function(index, object) {
options += '<option value="' + object.id + '">' + object.stop + '</option>';
});
$('#selectMenu').html(options);
Простой способ:
$('#SelectId').html("<option value='0'>select</option><option value='1'>Laguna</option>");
Используя функцию $ .map (), вы можете сделать это более элегантным способом:
$('#mySelect').html( $.map(selectValues, function(val, key){
return '<option value="' + val + '">'+ key + '</option>';
}).join(''));
function populateDropdown(select, data) {
select.html('');
$.each(data, function(id, option) {
select.append($('<option></option>').val(option.value).html(option.name));
});
}
Хорошо работает с jQuery 1.4.1.
Полный текст статьи об использовании динамических списков с ASP.NET MVC & amp; jQuery посещение: http://www.codecapers.com/post/Dynamic-Select-Lists-with-MVC-and-jQuery.aspx
Я сделал что-то вроде этого, загружая выпадающий элемент через Ajax . Ответ выше также является приемлемым, но всегда полезно иметь как можно меньше модификаций DOM для лучшей производительности.
Поэтому вместо добавления каждого элемента в цикл лучше собирать элементы в цикле и добавлять его после завершения.
$(data).each(function(){
... Collect items
})
Добавьте его,
$('#select_id').append(items);
или даже лучше
$('#select_id').html(items);
$.each
медленнее, чем цикл for
$("#mySelect").append();
Так что Наилучшим решением является следующее
Если данные JSON resp
равны
[
{"id":"0001", "name":"Mr. P"},
{"id":"0003", "name":"Mr. Q"},
{"id":"0054", "name":"Mr. R"},
{"id":"0061", "name":"Mr. S"}
]
, используйте их как
var option = "";
for (i=0; i<resp.length; i++) {
option += "<option value='" + resp[i].id + "'>" + resp[i].name + "</option>";
}
$('#mySelect').html(option);
Используя плагин Создателя Элементов DOM (мой фаворит):
$.create('option', {'value': 'val'}, 'myText').appendTo('#mySelect');
Используя Option
конструктор (не уверенный в поддержке браузера):
$(new Option('myText', 'val')).appendTo('#mySelect');
Используя document.createElement
(предотвращение дополнительного HTML парсинга работы с $("<option></option>")
):
$('#mySelect').append($(document.createElement("option")).
attr("value","val").text("myText"));
var output = [];
$.each(selectValues, function(key, value)
{
output.push('<option value="'+ key +'">'+ value +'</option>');
});
$('#mySelect').html(output.join(''));
In this way you "touch the DOM" only one time.
I'm not sure if the latest line can be converted into $('#mySelect').html(output.join('')) because I don't know jQuery internals (maybe it does some parsing in the html() method)
var output = [];
var length = data.length;
for(var i = 0; i < length; i++)
{
output[i++] = '<option value="' + data[i].start + '">' + data[i].start + '</option>';
}
$('#choose_schedule').get(0).innerHTML = output.join('');
Я провел несколько тестов, и я считаю, что это работает быстрее всего. : P
Это выглядит лучше, обеспечивает удобочитаемость, но работает медленнее, чем другие методы.
$.each(selectData, function(i, option)
{
$("<option/>").val(option.id).text(option.title).appendTo("#selectBox");
});
Если вам нужна скорость, самый быстрый (проверенный!) Способ - это использовать массив, а не конкатенацию строк и использование только одного вызова добавления.
auxArr = [];
$.each(selectData, function(i, option)
{
auxArr[i] = "<option value='" + option.id + "'>" + option.title + "</option>";
});
$('#selectBox').append(auxArr.join(''));
Это немного быстрее и чище.
var selectValues = {"1": "тест 1", "2": "тест 2"}; var $ mySelect = $ ('# mySelect'); // $ .each (selectValues, function (key, value) {var $ option = $ ("", {value: key, text: value}); $ mySelect.append ($ option);}) ;
Существует подход, использующий Microsoft Templating approach, который в настоящее время предлагается включить в ядро jQuery. Использование шаблонов имеет больше возможностей, поэтому для простейшего сценария это может быть не лучшим вариантом. Для получения более подробной информации см. пост Скотта Гу с описанием возможностей.
Сначала подключите файл templating js, доступный на github.
<script src="Scripts/jquery.tmpl.js" type="text/javascript" />
Далее создайте шаблон
<script id="templateOptionItem" type="text/html">
<option value=\'{{= Value}}\'>{{= Text}}</option>
</script>
Затем с вашими данными вызовите метод .render()
var someData = [
{ Text: "one", Value: "1" },
{ Text: "two", Value: "2" },
{ Text: "three", Value: "3"}];
$("#templateOptionItem").render(someData).appendTo("#mySelect");
Я писал в блоге об этом подходе более подробно.