Как добавить параметр в выбор и предотвратить исчезновение раскрывающегося списка при событии щелчка тега выбора
В моем случае мне нужно добавить опцию для выбора при нажатии на <select>
Теперь у меня есть <select> вот такой
<select class = "form-control" name = "commentid" id = "">
<option value = "">select</option>
</select>
и такой код js
$("select[name=commentid]").click(function(){
$.get(
"url",
function(data){
$("select[name=commentid] option:not(:eq(0))").remove();
$.each(data, function(k, v){
$("select[name=commentid]").append($("<option></option>").attr("vlaue", v.id).text(v.name))
})
}, "json"
)
})
опция обновляется, когда я щелкаю по выбору, но также исчезает из раскрывающегося списка
Я обнаружил, что append() закрыл раскрывающийся список, чтобы исчезнуть, но я не знаю, как это решить
в обычном случае вы нажимаете кнопку выбора, открывается раскрывающийся список, и вы можете выбрать вариант. Но в этом случае выберите отображается, а затем сразу исчезнет
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 4
Попробуй это.
$(document).ready(function () {
$("select[name=commentid]").click(function () {
var myOptions = [
{ 'val': "Value 1", 'text': "Text 1" },
{ 'val': "Value 2", 'text': "Text 2" },
{ 'val': "Value 3", 'text': "Text 3" }
];
$(myOptions).each(function (idx, obj) {
//console.info(idx);
//console.info(obj.text);
$('#commentid').append($('<option>', { value: obj.val, text: obj.text }));
});
})
});<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<select class = "form-control" name = "commentid" id = "commentid">
<option value = "">select</option>
</select>
</div>спасибо за вашу помощь, но это имеет некоторую разницу с моей проблемой. Я хочу добавить параметр при нажатии тега select, а не изменять событие выбора
Я отредактировал ответ в соответствии с вами, когда вы нажмете кнопку выбора, он добавит параметры.
Вы не можете. Вы используете только несколько атрибутов для выбора, но при этом не отображается кнопка раскрывающегося списка.
Я предлагаю вам selectpicker для решения вашей проблемы.
Прочитать пример здесь
Я полагаю, что вы пытаетесь здесь обновить параметры элемента управления select в событии click элемента управления select.
Итак, происходит следующее: когда вы нажимаете на элемент управления выбора (либо параметры в элементе управления выбора, либо сам элемент управления), выбранное значение не отображается при щелчке, который, как я полагаю, вы считаете исчезнувшим.
Причиной этого является ваша функция click, поскольку вы связали функцию click с элементом управления select (родительским), и из-за этого происходит event bubbling, который запускает родительское событие click из дочернего элемента.
Итак, если вы нажмете на свой вариант в элементе управления выбора, он все равно вызовет родительскую функцию click, поскольку дочерний элемент является частью родительской области, и в результате вы всегда будете видеть параметр по умолчанию (как в функции, которую вы повторно выполняете. создание опций для выбора), и вы не сможете увидеть выбранную опцию.
Таким образом, лучшим подходом было бы вызвать select option populate function из другого события, вместо того, чтобы звонить из него самого. Если у вас есть другое событие, вносящее изменения в конкретное поле выбора, это будет лучший подход.
попробуй это
$(function(){
$("select[name=commentid]").click(function(e){
if ($(this).children('option').length <= 1){
$.getJSON( "//www.json-generator.com/api/json/get/bUHzakaaDC", function(data){
$.each(data, function(k,v){
$('select[name=commentid]').append($('<option>', { value: v.id, text : v.name }));
});
});
}
});
});select{border: 1px solid #999; padding: 5px; width:125px}<script src = "//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select class = "form-control" name = "commentid" id = "">
<option value = "">select</option>
</select>
что вы подразумеваете под исчезнувшим из раскрывающегося списка?