86
necesito para añadir un poco de texto a un campo de entrada ...Añadir texto a los campo de entrada
A
Respuesta
166
$('#input-field-id').val($('#input-field-id').val() + 'more text');
+0
¡Muchas gracias! –
+3
Lea también mi respuesta sobre esta pregunta - Realmente no hay razón para tener que llamar '$ ('# input-field-id')' dos veces ... Respuesta muy simple, aunque - +1 – gnarf
+2
Siento que debería sea una función que agregue el valor de una entrada como se puede con el 'innerHTML'. –
5
Usted probablemente está buscando val()
17
Si usted está planeando utilizar añadiendo más de una vez, se puede ser que desee escribir una función:
//Append text to input element
function jQ_append(id_of_input, text){
var input_id = '#'+id_of_input;
$(input_id).val($(input_id).val() + text);
}
Después de que sólo puede llamarlo:
jQ_append('my_input_id', 'add this text');
+0
No puedo agregar marcador de posición a un cuadro de búsqueda y me gustaría utilizar esto y luego tener el cuadro despejado cuando el usuario coloca el cursor en el cuadro de búsqueda. ¿Es esto factible? – KevinOrin
92
Hay dos opciones. El enfoque de Ayman es el más simple, pero le agregaría una nota adicional. Usted realmente debe almacenar en caché selecciones jQuery, no hay ninguna razón para llamar a $("#input-field-id") dos veces:
var input = $("#input-field-id");
input.val(input.val() + "more text");
La otra opción, .val() También se puede tomar una función como argumento. Esto tiene el advantange de fácil trabajar en varias entradas:
$("input").val(function(index, val) {
return val + "more text";
});
3
\t // Define appendVal by extending JQuery
\t $.fn.appendVal = function(TextToAppend) {
\t \t return $(this).val(
\t \t \t $(this).val() + TextToAppend
\t \t);
\t };
//_____________________________________________
\t // And that's how to use it:
\t $('#SomeID')
\t \t .appendVal('This text was just added')<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<textarea
id = "SomeID"
value = "ValueText"
type = "text"
>Current NodeText
</textarea>
</form>bien al crear este ejemplo de alguna manera me dieron un poco confundido. "ValueText" vs>NodeText actual < no .val() se supone que debe funcionar con los datos del valor atributo? De todos modos, tú y yo podemos aclarar esto tarde o temprano.
Sin embargo, el punto de momento es:
Cuando se trabaja con los datos del formulario utilizar .val().
Cuando se trata de la única de datos sobre todo leer en entre el uso de etiquetas .text() o .append() para añadir texto.
+1
¿Esto agrega algo nuevo para responder mejor la pregunta? Entiendo que solo estás haciendo una extensión, pero esto ha sido respondido por bastante tiempo. Solo quiero asegurarme de que se mantenga la calidad de SO. –
+1
Gracias por cuidarme - Me gusta eso. Pero sí, tienes razón, no hay mucha novedad, la esencia se mantiene igual. Sin embargo, al digerir las respuestas actuales, sentí que podría hacerse un poco sobre el estilo y la implementación. Primero verifiqué si alguna de las publicaciones se podía editar, pero al final pensé que era mejor crear una nueva. ¿Qué hay de nuevo? * Puede ejecutar el recorte. * La extensión ayuda mucho en el camino para escribir código de auto-documentación, sin distraer demasiado la esencia. – Nadu
0
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<style type="text/css">
*{
font-family: arial;
font-size: 15px;
}
</style>
</head>
<body>
<button id="more">More</button><br/><br/>
<div>
User Name : <input type="text" class="users"/><br/><br/>
</div>
<button id="btn_data">Send Data</button>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#more').on('click',function(x){
var textMore = "User Name : <input type='text' class='users'/><br/><br/>";
$("div").append(textMore);
});
$('#btn_data').on('click',function(x){
var users=$(".users");
$(users).each(function(i, e) {
console.log($(e).val());
});
})
});
</script>
</body>
</html>
salida 
Cuestiones relacionadas
- 1. Añadir 1 a un campo
- 2. texto predeterminado en el campo de entrada
- 3. jQuery: Agregar texto después de un campo de entrada
- 4. Formulario Zend: Añadir un enlace a la derecha de un campo de texto
- 5. Añadir atributo al campo de texto auxiliar del riel?
- 6. Cómo añadir texto a todos los valores de JavaScript matriz
- 7. Entrada de entrada personalizada para UITextField, ¿cómo dirijo la entrada de regreso al campo de texto?
- 8. rieles Formtastic: añadir campo "Data-" a la etiqueta de opción
- 9. ¿Span dentro del campo de entrada de texto?
- 10. Añadir un campo de java.lang.Object
- 11. Trimming Struts2 cadena de campo de texto de entrada
- 12. Añadir texto simple a Panel de control
- 13. PHP Añadir cadena a archivo de texto
- 14. simple línea de campo de entrada de texto aceptar rompe
- 15. Obtener entrada de teclado sin un campo de texto/vista
- 16. jQuery: ¿texto de color animado para el campo de entrada?
- 17. ¿Cómo esperar la entrada en un campo de texto?
- 18. Configuración del texto del campo de entrada de Jquery Mobile
- 19. Programando texto parcialmente parcial en un campo de entrada
- 20. ¿Detecta el "valor" del campo de texto de entrada después de un evento de selección en el campo de texto?
- 21. Restringir los caracteres de entrada en el campo de texto/campo de número utilizando la expresión regular?
- 22. ¿Cómo se hace algo de texto, dentro de un campo de texto de entrada, en negrita?
- 23. Añadir propiedad onclick a la entrada con JavaScript
- 24. Añadir Anotación Java de campo heredada
- 25. Cómo agregar un marcador de posición a un campo de entrada de texto GWT
- 26. Permitir solo texto numérico en el campo de texto de entrada
- 27. Adjuntar campo de texto de entrada con el valor de un div
- 28. Alinear a la derecha el texto en el campo de entrada de HTML
- 29. Flex - Cómo enlazar (bidireccional) un entero a un campo de entrada de texto
- 30. extjs texto de entrada maskRe
posible duplicado de [¿Es posible hacer ".value + =" en jQuery?] (Http://stackoverflow.com/questions/1224133/is-it-possible -to-do-value-in-jquery) –