2012-08-08 38 views
51

Tengo una entrada HTML con un enlace en el valor.jQuery .val change no cambia el valor de entrada

<input type = 'text' value = 'http://www.link.com' id = 'link' /> 

Estoy utilizando jQuery para cambiar el valor de un determinado evento.

$('#link').val('new value'); 

El código anterior cambia el valor del cuadro de texto, pero no cambia el valor en el código (valor = 'http://www.link.com' se mantiene sin cambios). Necesito el valor = '' para cambiar también.

+0

¿Qué quiere decir con 'en el code'? ¿Estás mirando la fuente original (por lo tanto, no modificada) de la página? –

+0

Usando el elemento de inspección de Chrome. – Lukas

+2

@Luke El valor cambiará, pero el valor visible del elemento HTML en el inspector de Chrome no lo hará. Intenta entonces alertar el valor o enviarlo a la consola y verás que ha cambiado. Mira, ha cambiado: http://jsfiddle.net/a8SxF/ – TheZ

Respuesta

105

Use attr en su lugar.
$('#link').attr('value', 'new value');

demo

+4

Esto es totalmente correcto, al usar 'setAttribute' o jQuery's' attr' también afectará el valor del elemento DOM: http://jsfiddle.net/a8SxF/1/ – TheZ

+3

@TheZ eso es porque el indicador de valor sucio de la entrada es falso. Intente interactuar con la entrada (el valor está sucio después de la entrada del usuario) y luego configureAttribute – Esailija

+0

@Esailija Wow, eso explica mucho. Justo cuando pensaba que no podría haber más tipos de capturas xD – TheZ

9

Cambiar la propiedad del valor no cambia el defaultValue. En el código (obtenido con .html() o innerHTML), el atributo de valor contendrá el defaultValue, no la propiedad del valor.

+0

Eso lo explica. Escribir tampoco cambia el pero sí el resultado de $ ("# a"). Val(). Una pregunta para estar segura: es $ ("# a").val (valor) ¿realmente es la forma correcta de cómo cambiar el valor de un elemento de entrada, de modo que se envíe el valor correcto? –

+0

Sí, eso es correcto. cambiar el atributo no cambiará lo que se está enviando. –

0
<script src="//code.jquery.com/jquery.min.js"></script> 
<script> 
function changes() { 
$('#link').val('new value'); 
} 
</script> 
<button onclick="changes()">a</button> 
<input type='text' value='http://www.link.com' id='link'> 
+1

Sí, esto no t actualiza la ac valor real sin embargo. Actualiza el cuadro de texto en pantalla, pero cuando intentas enviar un formulario, el valor es el que fue cuando la página se cargó originalmente. – Grant

1

Esto es sólo un posible escenario que me ha pasado. Bueno, si ayuda a alguien, entonces genial: escribí una aplicación complicada que en algún lugar a lo largo del código utilicé una función para borrar todos los valores de los cuadros de texto antes de mostrarlos. Algún tiempo después intenté establecer un valor de cuadro de texto usando jquery val ('valor') pero no me di cuenta de que justo después de eso invoqué el método ClearAllInputs ... así que esto también podría suceder.

2

para ampliar un poco en la respuesta de Ricardo: https://stackoverflow.com/a/11873775/7672426

http://api.jquery.com/val/#val2

sobre Val()

valores usando este método Configuración (o el uso de la propiedad del valor nativo) no causa el envío del evento de cambio. Por esta razón, los controladores de eventos relevantes no se ejecutarán. Si desea ejecutarlos, debe llamar a .trigger ("cambiar") después de establecer el valor.

0

Mi problema similar fue causado por tener caracteres especiales (por ejemplo, períodos) en el selector.

La solución era escapar los caracteres especiales:

$("#dots\\.er\\.bad").val("mmmk"); 
Cuestiones relacionadas