Adición de texto a checkbox de control en jQuery

Question

tengo el esta casilla de verificación Estoy intentando crear en jQuery

<input type="checkbox" id="someID">Hello World</input> 

pensé que esto era el código equivalente JQuery:

var $ctrl = $('<input/>').attr({ type: 'checkbox', id: 'someID', text: 'Hello World'}) 

Pero, cuando agregue $ ctrl a esta etiqueta div, parece que no incluye el texto "Hola mundo".

$("#renderedControl").append($ctrl); 

¿Alguna idea de lo que me falta?

Answer 1

probar este

var $ctrl = $(document.createElement("input")).attr({ 
        id: 'topicFilter-' 
        ,name: 'test' 
        ,value: 'test' 
        ,text :'my testing' 
        ,type: 'checkbox' 
        ,checked:true 
      }) 

var lbl = '<label>Hello world</label>'; 


$("#renderedControl").append($ctrl.after(lbl)); 

Lúpulo su ayuda

Answer 2

El marcado correcto para lo que estamos tratando de hacer es esto:

<label><input type="checkbox" id="someID">Hello World</label> 

Los elementos de entrada no pueden incluir contenido (y sólo requieren una etiqueta de cierre o de cierre automático en XHTML).

Para crear lo anterior con jQuery intentar alguna variación en esto:

var $ctrl = $('<label />').html('Hello world') 
          .prepend($('<input/>').attr({ type: 'checkbox', id: 'someID'})); 

Demostración: http://jsfiddle.net/bwxza/

Answer 3

primero si desea crear la casilla de verificación hacerlo de esta manera

$("#renderedControl").append('<input type="checkbox" id="someID"/>'); 

Nota que html del cheque debe definirse así

<input type="checkbox" name="example" id="someID" /> 

Si desea establecer una etiqueta, debe crear un elemento para esa casilla de verificación, la razón detrás de eso no puede ver el mundo de Hellow, no es correcto usar texto para establecer una etiqueta para una casilla y creo que es ni siquiera un atributo válido para ese tipo. He aquí un ejemplo del HTML relacionada con una etiqueta para que la casilla de verificación

<label for="example">Hellow world</label> 

Y luego anexar todos los html relacionados como esto

$("#renderedControl").append('<label for="checkbox">Hellow world</label>').append('<input type="checkbox" name="checkbox" id="someID" />') 

Al final se puede crear algo como esto

http://jsfiddle.net/ynMK8/

Answer 4

<input /> elementos no son pares de etiquetas.Son auto-cierre:

<input type="checkbox" id="someID" name="someName" value="input" /> 

con jQuery, usted puede hacer esto:

$('<input />', { 
    'type': 'checkbox', 
    'id': 'someID', 
    'name': 'someName' 
}).after($('<label />', { 
    'for': 'someName' 
}).text('Hello World')).appendTo('body');​ 

Demostración: http://jsfiddle.net/KNnUt/