11
$("#add_city_btn2").click(function() {
    var city = $("#add_city2").val();
    $("#cities2").append($("<option>", { text: city, selected: "selected"})).change();
    $("#add_city2").val('');
    return false;
});   

o que significa a linha abaixo desse código? não entendi principalmente a parte entre chaves.

 $("#cities2").append($("<option>", { text: city, selected: "selected"})).change();           

2 Respostas 2

11

É criado uma option nova com o texto(descrição), que está contido na variável city e é marcado como selected opção selecionada.

{ text: city, selected: "selected"}
11

Essa linha faz 4 coisas:

#1: seleciona o elemento com ID cities2

Esta é a funcionalidade básica do jQuery, selecionar elementos do DOM, meste caso provavelmente <select id="cities2">. O equivalente em JavaScript nativo seria

document.getElementById('cities2');

#2: cria um novo elemento option

$("<option>", { text: city, selected: "selected"}) cria um novo elemento que fica no HTML com este aspeto:

<option selected="selected"><o valor da variavel city></option>

#3: adiciona-o no select com .append()

Aqui o jQuery insere este novo elemento no final dos descendentes do <select>. O equivalente nativo é .appendChild().

#4: dispara um evento change

Este código anterior (em #1, #2 e #3) muda a opção selecionada no select. Porém como isto é feito programáticamente e não por interação do utilizador é preciso disparar o evento change para outras partes do código que estejam à espera de correr quando o select fôr mudado serem acionados.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .