2009-05-04 6 views
1

나는 이와 같은 데이터가있는 테이블이 있습니다JQuery와, 부모 요소의 onclick =에서는 window.location을 방지

<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> 

제가하는 데 문제는 당신이 (지침) 링크를 클릭하면, 그것은해야 지시 사항이 표시된 창을 팝업하십시오. 그것은 그것을하지만 TR의 onclick도 발생시킵니다. 그래서 나는 두번째 분할을위한 팝업을 얻는다. 그리고 download.php로 간다.

TR의 onclick 발사를 막을 수있는 방법이 있습니까? 가급적 jquery를 사용하여,하지만 난 일반 자바 스크립트 솔루션을 상관하지 않습니다.

답변

3

기본적으로 propagation of events은 event.cancelBubble (IE 용) 또는 event.stopPropagation() (다른 모든 사용자 용)을 사용하여 중지해야합니다.

<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> 

이 그런 다음 스크립트를 부를 것이다 : (I 전에 사용했습니다)를 solution given from quirksmode 이런 식으로 뭔가하는 것입니다,

<td>Program 1<br/>Short Description 1 (<a onclick="instructions(event)">Instructions</a>)</td> 

(물론,이 모든 인라인을 넣을 수를하지만, 그건 피 묻은 혼란이야.)

this question 조명을 찾을 수도 있습니다.

+0

나는 16 분 동안 계속 놀랐다. – cgp

+0

감사합니다. 이것은 완벽하게 작동합니다. – Samutz

0

당신은

onclick="false" 

을 쓸 수 및 (다른 브라우저에서 예 또는 또는 addEventListener는 attachEvent) 이벤트 모델 레벨 2를 사용하여 이벤트를 추가 할 수 있습니다. jquery를 사용하는 경우 jquery bind ('click') 할 수도 있습니다.

관련 문제