href solucion

ronnyra · #1 (**permalink**) 03/05/2011, 14:00

hola amigos quiciera saber como hacer si tengo un campo de texto y una etiqueta <a href> para que lo que yo escriba en el campo de texto lo pueda pasar por el href

como lo hago?

IsaBelM · #2 (**permalink**) 03/05/2011, 14:27

con el evento onkeyup invocas una función, pasandole como parámetro el valor del campo textfield. en esta función haces referencia a la id del vinculo al que quieres cambiar la referencia y le asignas el valor del parámetro

zerokilled · #3 (**permalink**) 03/05/2011, 14:29

buenas,
bien puedes hacerlo con javascript pero, ¿no te seria mas comodo con un formulario? por un lado con un formulario no requieres de javascript, y por otro no tienes que ocuparte de crear los parametros. con javascript, es igualmente facil hacerlo pero te corres el riesgo de que no funcione si el usuario no dispone de javascirpt. si es por cuestion de estetica, igualmente puede hacer un boton submit que parezca un enlace.

de todas formas, debes obtener la referencia del enlace para poder leer la propiedad href. luego, mediante algun evento -puede ser de teclado o foco- lees el valor del campo (propiedad value) y lo concatenas con el string que devuelve href. una vez concatenado, el string lo agregas a la misma propiedad href.

Código:

// asumiendo que link_ref es una referencia del enlace ;
<a href="...">link</a> <input event="link_ref.href  = link_ref.href + value" />
// el codigo requiere de otros ajustes, pero es una base ;

Pablo Ayala · #4 (**permalink**) 03/05/2011, 14:37

Hola!

Creo que te puede servir algo como esto:

Código Javascript:

Ver original<script>
$(document).ready(function(){
    $("#nombre").keyup(function(){
        nombre  = $("#nombre").val();
        $("#lblNombre").html("<a href="+ nombre+">"+nombre+"</a>");
    });
});    
</script>

Donde nombre es el ID del input que desencadena la funcion.
#lblNombre es el id del div donde se "pintara" el link....

Recuerda que debes incluir esta linea de codigo en el head de tu pagina:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Espero que te sirva

ronnyra · #5 (**permalink**) 03/05/2011, 14:51

gracias por la respuestas voy a probar y les comento

ronnyra · #6 (**permalink**) 03/05/2011, 14:53

Cita:

Iniciado por Pablo Ayala

Hola!

Creo que te puede servir algo como esto:

Código Javascript:

Ver original<script>
$(document).ready(function(){
    $("#nombre").keyup(function(){
        nombre  = $("#nombre").val();
        $("#lblNombre").html("<a href="+ nombre+">"+nombre+"</a>");
    });
});    
</script>

Donde nombre es el ID del input que desencadena la funcion.
#lblNombre es el id del div donde se "pintara" el link....

Recuerda que debes incluir esta linea de codigo en el head de tu pagina:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Espero que te sirva

pablo en el href tengo variables php y php dentro de js no se puede....

Pablo Ayala · #7 (**permalink**) 04/05/2011, 07:17

Hola Ronnyra....
Tomando en cuenta una critica bastante constructiva que me hizo cierta persona en foros del web. Olvida el codigo anterior que te puse y mejor usa esta solución:

Código PHP:

Ver original<body>  
  <div id="cabecera"></div>
  <div id="cuerpo">
    
    <h3>Nombre</h3>
    <form id="forma">
    <input id="nombre" name="nombre" type="text" onkeyup="javascript:linkeo(this.name)">
    <br/>
    <button id="BtnGuarda" type="button" >Guardar</button>  
    </form>
    
    <?php
    $variable = "hola";
    ?>
    
    <div id="link"></div>
    
    <script type="text/javascript">
    function linkeo(nombre){    
         var l=document.getElementById(nombre).value;
         document.getElementById("link").innerHTML = "<a href="+l+"?variable=<?php echo $variable ?>>"+l+"</a>"; 
    }
    </script>
 
  </div>
</body>

Saludos!