la creación de elementos de casillas de verificación sobre la marcha con jQuery - IE extraño comportamiento

Question

estoy creando algunos elementos casilla de verificación en la marcha con jQuery y añadiéndolos a un nodo igual que

var topics = ['All','Cat1','Cat2']; 
var topicContainer = $('ul#someElementId'); 

$.each(topics, function(iteration, item) 
{ 
    topicContainer.append(
     $(document.createElement("li")) 
     .append(
      $(document.createElement("input")).attr({ 
       id: 'topicFilter-' + item 
       ,name: item 
       ,value: item 
       ,type: 'checkbox' 
       ,checked:true 
      }) 
      .click(function(event) 
      { 
       var cbox = $(this)[0]; 
       alert(cbox.value); 
      }) 
     ) 
     .append(
      $(document.createElement('label')).attr({ 
       'for': 'topicFilter' + '-' + item 
      }) 
      .text(item) 
     ) 
    ) 
}); 

Los problemas que estoy encontrando son dos -fold (existen sólo en IE)

• las casillas de verificación se añaden a la página, pero su defecto comprobado el estado no está marcada, cuando estoy especificando 'verdadero' para ese valor. (La prueba con 'marcado' para el valor no hace ninguna diferencia)
• Cuando se ejecuta alert(cbox.value);, la salida está 'encendida', cada vez.

Creo que el problema central aquí es que necesito una mejor manera de establecer el estado predeterminado de las casillas de verificación y establecer su atributo de "valor" predeterminado. Pero aún no he encontrado otra manera.

Nota: todo este código funciona bien en Firefox y Chrome.

Esta es la prueba de jQuery 1.3.1 con IE 7.0.5730.11

Answer 1

Internet Explorer no le gusta que le permite cambiar el valor comprobado de una entrada que no es una parte de la DOM. Intente configurar el valor verificado DESPUÉS de que se haya agregado el artículo y vea si eso funciona.

Answer 2

que reutiliza algunos de su código y tenía un problema similar según

Why does order of defining attributes for a dynamically created checkbox in jquery affect its value?

me encontré con la resolución era simplemente mover la declaración de atributo

type: 'checkbox', 

al principio, es decir:

$(document.createElement("input")).attr({ 
type: 'checkbox', 

Este problema se produjo en todos navegadores para mí, así que no creo que sea un problema de IE, sino más bien una "cosa" jquery. Para mí, no importó cuando establecí el valor (antes o después) de agregar. La diferencia estaba en cuán pronto/dónde declaro el tipo de entrada.

Answer 3

El atributo "marcado" de una casilla de verificación marcada no tiene un estado verdadero, tiene un estado de cadena "marcado". Normalmente agrego elementos a DOM con jQuery usando:

var el = $('<input type="checkbox" id="topicFilter-' + '"' 
     + ' checked="checked" />'); 
$(topicContainer).append(el); 

Más legible de todos modos, IMO, se lee como HTML. Estaré condenado si no funciona en IE, también, lo he estado haciendo así durante años.