boton - ¿Cómo configuro el valor de un cuadro de texto usando un ancla con jQuery?

boton ancla html

Question

Tengo un cuadro de texto cuyo valor quiero establecer en función del texto interno de una etiqueta de anclaje. En otras palabras, cuando alguien hace clic en este ancla:

<a href="javascript:void();" class="clickable">Blah</a>

Quiero que mi cuadro de texto se rellene con el texto "Blah". Aquí está el código que estoy usando actualmente:

<script type="text/javascript">
    $(document).ready(function(){
        $("a.clickable").click(function(event){
            $("input#textbox").val($(this).html());
        });  
    });
</script>

Y en mi html hay una lista de etiquetas de anclaje con la clase "seleccionable" y un cuadro de texto con el id "cuadro de texto".

He sustituido el código anterior con código para mostrar una alerta de javascript con $ (this) .html () y parece mostrar el valor correcto. También he cambiado el $ (this) .html () para que sea una cadena codificada y el valor del cuadro de texto sea el correcto. Pero cuando los combino, el cuadro de texto simplemente se borra. ¿Qué estoy haciendo mal?

Answer 1

Siguiendo a redsquare: no debe usar en el atributo href el código javascript como "javascript: void ();" - está mal. Mejor uso, por ejemplo, href = "#" y luego en su controlador de eventos como último comando: "return false;". Y aún mejor: utilícelo en el enlace correcto de href. Si el usuario tiene javascript desactivado, el navegador web sigue el enlace; en este caso, su página web debe volver a cargarse con la entrada que contiene el valor de ese enlace.

Answer 2

Solo para observar que el prefijo de tagName en un selector es más lento que solo usar el id. En su caso, jQuery obtendrá todas las entradas en lugar de simplemente usar el getElementById. Solo usa $ (''# textbox'')

Answer 3

Para asignar el valor de un cuadro de texto cuyo id. Es "cuadro de texto" en JQuery, haga lo siguiente

$ ("# textbox"). get (0) .value = "blah"

Answer 4

Escribí este fragmento de código y funciona bien:

<a href="#" class="clickable">Blah</a>
<input id="textbox">
<script type="text/javascript">
    $(document).ready(function(){
        $("a.clickable").click(function(event){
            event.preventDefault();
            $("input#textbox").val($(this).html());
        });  
    });
</script>

¿Tal vez olvidaste dar "clic" a un nombre de clase en tus enlaces?

Answer 5

Para asignar el valor de un cuadro de texto cuyo id es ёtextboxё en jQuery, haga lo siguiente

$("#textbox").val(''Blah'');