jquery, prevent onclick = window.location en el elemento padre
-
03-07-2019 - |
Pregunta
Tengo una tabla con datos como este:
<table>
<tr onclick="window.location='download.php?id=1'">
<td>Program 1<br/>Short Description 1 (<a onclick="$.popup.show('Install Instructions', 'Instructions pulled from DB here')">Instructions</a>)</td>
<td>Added by user and date/time here<td>
<td>Filesize here<td>
<td><a href="edit.php?id=1">Edit</a> - <a href="delete.php?id=1">Delete</a><td>
</tr>
(repeat TRs for more programs pulled from DB)
</table>
El problema que tengo es que cuando haces clic en el enlace (Instrucciones), debería aparecer una ventana con las instrucciones. Lo hace, pero también dispara el clic del TR. Entonces obtengo la ventana emergente por una fracción de segundo y luego va a download.php.
¿Existe alguna forma de evitar que dispare el clic del TR? Preferiblemente use jquery, pero tampoco me importa una solución javascript simple.
Solución
Básicamente, debe detener propagación de eventos , usando event.cancelBubble ( para IE) o event.stopPropagation () (para todos los demás). La solución dada desde quirksmode (que he usado antes) es lo que debe hacer algo como esto:
<script type="text/javascript">
var instructions = function(e) {
// Get the correct event in a cross-browser manner, then stop bubbling/propagation.
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
// Do what you want now
$.popup.show('Install Instructions', 'Instructions pulled from DB here');
}
</script>
Entonces tu guión lo llamaría:
<td>Program 1<br/>Short Description 1 (<a onclick="instructions(event)">Instructions</a>)</td>
(Por supuesto, podrías poner todo esto en línea, pero eso es un lío sangriento).
También puede encontrar esta pregunta iluminando .
Otros consejos
stopPropogation es el que quieres.
http://docs.jquery.com/Events/jQuery .Event # event.stopPropagation.28.29
Puedes escribir
onclick="false"
y agregue eventos utilizando el nivel de modelo de evento 2 (attachEvent en ie o addEventListener en otros navegadores). También puede juntar jquery ('clic') si usa jquery.