2010-10-14 14 views
6

Estoy analizando una respuesta JSON a través de $.ajax() y construyendo un formulario a partir de los valores de este objeto. El guión que he escrito es largo, pero esto es lo que está haciendo:jQuery .attr ('tipo', 'enviar') en un elemento de botón que me da un error extraño en IE7

  1. dinámicamente la creación:
    ~ un elemento de formulario,
    ~ un elemento de campos,
    ~ un elemento de botón,
    ~ 20 o así entradas de texto y elementos de la etiqueta

  2. Anexión de las entradas y las etiquetas a la fieldset

  3. al añadir el botón a la FIELDSET

  4. añadiendo el fieldset a la forma

  5. Al añadir la forma de un elemento en el DOM existente.

Todo funciona en todos los navegadores excepto en un pequeño fragmento en IE. Lo he reducido a la siguiente pieza de código. (doc es una variable que contiene document)

fieldset.append(
    $(doc.createElement('button')) 
     .addClass('ui-button') 
     .attr('type', 'submit') 
     .html('Re-Rate') 
     .button() 
); 

Este es el paso 3 de arriba. Crea un elemento de botón, agrega una clase, establece el atributo type en submit, le da un texto y luego lo agrega al conjunto de campos. IE falla con el error "Objeto no admite esta acción"

Si comento hacia fuera de la línea de .attr() así:

fieldset.append(
    $(doc.createElement('button')) 
     .addClass('ui-button') 
     //.attr('type', 'submit') 
     .html('Re-Rate') 
     .button() 
); 

Todo funciona como se esperaba.

Si usted se está preguntando, el método es .button() jQuery UI

+0

Lo que sucede si 'doc.createElement()' en primer lugar, se asigna el tipo de JS simple, y luego convertirlo en un objeto jQuery? ¿Solo para descubrir en qué paso está el problema? –

+1

Es posible que desee considerar el uso de una jQuery plantillas [motor] (http://github.com/nje/jquery-tmpl) - [ejemplo] (http://weblogs.asp.net/scottgu/archive/2010/ 05/07/jquery-templates-and-data-linking-and-microsoft-contribuyendo-a-jquery.aspx) –

+0

Buena idea John. Pekka, por la respuesta de Nick, parece ser jQuery-By-Design. – Stephen

Respuesta

10

jQuery doesn't allow you to change the type of an <input> or <button> element.

La razón de esto es la consistencia, y IE no le permite cambiar el type una vez que se ha insertado en el DOM.

+1

¡Interesante! No lo sabía ¿Cómo uno crearía dinámicamente un ''? – Stephen

+0

Técnicamente aún no lo he insertado en el DOM ... – Stephen

+4

@Stephen - Correcto, pero jQuery no lo permite en todos los casos, aunque IE estaría bien en tu ejemplo. Para crear el elemento simplemente créelo con el elemento html: '$ ('

0

jQuery no le permitirá modificar el atributo type en un elemento de botón existente porque IE arroja un error cuando intenta hacerlo.

Sin embargo, puede intentar algo como esto (usando jQuery 1.4 más concisa de sintaxis de creación del elemento):

fieldset.append(
    $('<button>', {'type': 'submit', 'class': 'ui-button', 'html': 'Re-Rate'}).button() 
); 
+1

No puede crear un elemento como este, la sintaxis no es válida, y si fuera arrojaría un error. No puede tener atributos en la cadena HTML * y * el objeto propiedad (pruébelo :)). –

+0

Vaya, he actualizado mi respuesta para que ahora funcione. – gabriel

Cuestiones relacionadas