Pasar el id de un input como parametro para recuperar en funcion con DOM

elputoamo65 · #1 (**permalink**) 26/10/2012, 08:33

Holas buenas, tengo que hacer un ejercicio en el cual tengo una caja de texto, al escribir en ella y pulsar en el boton "añadir" añado un enlace.
Al dar al enlace me tiene que saltar una funcion en el cual me preguntara si quiero borrar el enlace, si no es asi me preguntara si quiero abrir el enlace.

El problema es que como puedo tener varios enlaces creados, para poder distinguirlos les asigno un id con un valor igual al texto que tengo en la caja y en la funcion de cada enlace lo que hago es pasar su id como parametro y asi trabajar con ella en la funcion, el problema es que no me reconoce el parametro que le paso en

$enlace.href = "javascript: nuevafuncion(this.id);";

Un saludo.

Código HTML:

 <head>
        <script src="JAVASCRIPT10.js" type="text/javascript"></script>
        <title>
        Ejercicio 10
        </title>	
    </head>    
    <body onload="borrar();">
        <table style="border: 1px solid black;" id="tabla" width="400" align="center">
            <form name="form1">
                <tr>
                    <td align="center">
                        <input type="text" id="caja1">
                    </td>
                </tr>
                <tr>
                     <td align="center">
                        <input type="button" id="add" value="Añadir" onclick="fadd();">
                    </td>
                </tr>
                <tr>
                    <td id="td1" align="center"></td>
                </tr>
            </form>
        </table>   
    </body>

Código:

function borrar(){
	document.getElementById("caja1").value = null;
}

function fadd($d){
var $texto = document.getElementById("caja1").value;
var $enlace = document.createElement("a");
var $salto = document.createElement("br");
var $nodo = document.createTextNode($texto);

$enlace.appendChild($nodo);
$enlace.id = $texto;

$enlace.href = "javascript: nuevafuncion(this.id);";

var $td = document.getElementById("td1");

$td.appendChild($enlace);
$td.appendChild($salto);
$td.appendChild($salto);


}
function nuevafuncion($miId)
{
var $enlace = document.getElementById($miId);
 
	var $respuesta1 = confirm ("¿Desea borrar el enlace?");
	if ($respuesta1)
	{			
		$enlace.parentNode.removeChild($enlace);
	}
	else
	{
		var $respuesta2 = confirm ("¿Desea visitar el enlace?");
		if ($respuesta2)
		{
			location.href = "http://www." + $enlace + ".com";
		}
	}
}

lubtufano · #2 (**permalink**) 26/10/2012, 18:26

Pues en efecto, no funciona de esa forma, lo que se puede hacer es emplear esta manera para definir el href de los enlaces.

$enlace.href = "javascript: nuevafuncion('" + $texto + "');";

elputoamo65 · #3 (**permalink**) 26/10/2012, 18:35

Cita:

Iniciado por lubtufano

Pues en efecto, no funciona de esa forma, lo que se puede hacer es emplear esta manera para definir el href de los enlaces.

$enlace.href = "javascript: nuevafuncion('" + $texto + "');";

Gracias, justo me acaba de dar cuenta.

furoya · #4 (**permalink**) 26/10/2012, 19:04

O cambiar el destino del enlace por "#", y agregar

Código:

$enlace.setAttribute('onclick','nuevafuncion(this.id); return false');

Otro detalle está en el location.href. Le estás pasando el objeto cuando le tenés que meter el identificador, que es igual a esa url parcial.

caricatos · #5 (**permalink**) 27/10/2012, 00:01

Hola:

¡Digo yo!, si no tienes la intención de enlazar, ¿porqué tienes que usar un enlace?...

Si abrir el enlace es ir a una url, ese borrar debe estar asociado al evento asociado del enlace (click)...

Saludos

elputoamo65 · #6 (**permalink**) 27/10/2012, 04:33

Cita:

Iniciado por furoya

O cambiar el destino del enlace por "#", y agregar

Código:

$enlace.setAttribute('onclick','nuevafuncion(this.id); return false');

Otro detalle está en el location.href. Le estás pasando el objeto cuando le tenés que meter el identificador, que es igual a esa url parcial.

Gracias, ya me habia dado cuenta.

Cita:

Iniciado por caricatos

Hola:

¡Digo yo!, si no tienes la intención de enlazar, ¿porqué tienes que usar un enlace?...

Si abrir el enlace es ir a una url, ese borrar debe estar asociado al evento asociado del enlace (click)...

Saludos

Es lo que me pide el ejercicio, que cuando pinche en el enlace me lance esta función, si te refieras a la funcion borrar es simplemente para resetear los text box cada vez que actualizo la pagina.

Ya esta todo resuelto gracias por la ayuda.

furoya · #7 (**permalink**) 27/10/2012, 07:23

De nada, elputoamo65, y no es tanto que te ayudamos; aquí no le hacemos la tarea a nadie. Lo que pasa es que pusiste un ejemplo de problema como corresponde, planteaste una duda correctamente y demostraste un conocimiento más que suficiente para saber que vas a entender nuestras respuestas.
Entonces aprovechamos tu post como ejemplo, y le seguimos dando vueltas con opciones porque -aunque la idea no es que vengan a pedir, sino a aportar- esa pregunta con su código sirve de ejercicio a quienes vienen a aprender; porque desarman y experimentan.

caricatos, mi amigo, qué alegría verlo! O está viniendo poco o nos desencontramos mucho. Hace un montón que no comparto un tema con usted!

Yo pensé exactamente lo mismo del enlace (¿ves? ya estoy aprendiendo). Pero me acordé de un muy viejo post donde a esa duda le dieron una buena explicación : necesitaban mantener por una cuestión de diseño los mismos formatos de un link default, tal como viene configurado (o personalizado) en el navegador. Creo que en ese caso estaban "mezclados" con links reales, y estos no lo eran.
El paso siguiente a mi recomendación de agregarle el onclick era justamente hacer un ejemplo metiendo el invento en un span. Pero ya no vale la pena. Se entendió perfectamente el punto.