4

Por ejemplo si añado un select con .append() y luego quiero añadir options a ese select añadido, ¿Cómo lo puedo asignar a una variable a la vez que lo añado?

La única forma que he conseguido es buscarla después de añadirla con el método .find()

$(this).append('<select></select>');
var select = $(this).find('select');
select.append($('<option>', {
    value: 5,
    text: 'texto',
))

Esto creo que no es correcto o algo no he echo bien

var select = $(this).append('<select></select>');
select.append($('<option>', {
    value: 5,
    text: 'texto',
))

Me gustaría saber si existe alguna forma de hacerlo más elegante

4 respuestas 4

3

Lo que buscas hacer, tener en una variable el elemento que estás añadiendo sería justo lo contrario de lo que estás haciendo.

var this_ = $(this).append(elemento);

La variable this_ hace referencia al elemento jQuery $(this)

var select = $('<select></select>').appendTo($(this));

En este caso la variable select hace referencia al elemento jQuery creado. (Ya que estos métodos de jQuery devuelven el propio objeto).

var body = $('body');
var select = $('<select></select>').appendTo(body);
var optiona = $('<option value="aaa">aaa</option>').appendTo(select);
var optionb = $('<option value="bbb">bbb</option>').appendTo(select);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

2

Yo le asignaría un id:

$(this).append('<select id="appended"></select>');

$("#appended").append($('<option>', {
    value: 5,
    text: 'texto',
))
1

Creo que el problema con tu código es poner <select></select>, sólo deberías poner <select>, y quedaría así:

    $(this).append('<select>').append($('<option>', { 
        value: 5,
        text : 'texto'
    }));
1

Otra forma y es una forma muy entendible seria la siguiente:

//fase de creacion de elementos
var body = $('body');//variable para el body
var select = $('<select></select>');//crear el select
var optionA = $('<option value="A">opcion A</option>');//creas los options
var optionB = $('<option value="B">opcion B</option>');
//fase de enlazar elementos.
select.append(optionA);
select.append(optionB);
body.append(select);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.