jQuery 대화 상자 호출 페이지 재 지정

Question

jQuery 대화 상자 플러그인을 사용하고 있습니다.

대화 사업부는 페이지로드 설정 (하지만 오픈)되어

$(document).ready(function(){ 
    $('#foo').dialog({autoOpen:false}); 
}); 

그런 다음 하이퍼 링크 대화 상자 열 예정이다 :

<a href="javascript:$('#foo').dialog('open');">Show dialogue box</a> 

을하지만이 다음 대화 상자를 엽니 다 분수는 나중에 URL이 javascript:$('#foo').dialog('open'); 인 페이지로 리디렉션됩니다! 내가 false를 반환 시도

:

<a href="javascript:$('#foo').dialog('open');return false;">Show dialogue box</a> 

하지만 그것을 클릭하면 다음 링크가 전혀 응답하지 않습니다.

JavaScript의 악명 높은 미묘함 중 하나와 관련이 있어야한다는 것을 알고 있지만 해결하지 못합니다.

아무도 도와 줄 수 있습니까?

Answer 1

그런 다음 하이퍼 링크 대화 상자 열 예정이다 :

<a href="javascript:$('#foo').dialog('open');">Show dialogue box</a>

을하지만이 대화 상자를 열고 그 일부는 나중에 URL의 자바 스크립트가있는 페이지로 리디렉션 : $ ('#foo'). 대화 상자 ('open');

그렇게해서는 안됩니다. 의사 프로토콜 javascript:은 페이지로드를 포함하지 않으며 HTTP를 통한 액세스도 아닙니다. 나는 그것을 권장하지 않는다 (jQuery의 click 핸들러를 대신 사용한다).하지만 작동해야한다. 내가 false를 반환 시도

: ... 하지만 그것을 클릭하면 다음 링크가 전혀 응답하지 않습니다.

도 발생하지 않아야합니다.

따옴표로 묶인 코드는 괜찮습니다 (예 : http://jsbin.com/inixa5). 페이지의 다른 부분에 문제가 있어야합니다.

업데이트 : 좋습니다. IE6과 IE7은 그렇게 좋지 않습니다. 나는 dialog이 값을 돌려주기 때문이라고 생각합니다.당신은 그 주위에 중 함수에서 대화 상자를 엽니 다 전화를 마무리함으로써 얻을 수있는 명시 적으로 아무 것도 반환하지 않습니다

<a href="javascript:showDialog('#foo');">Click Me</a> 
<script> 
    $("#foo").dialog({autoOpen: false}); 
    function showDialog(selector) { 
    $(selector).dialog('open'); 
    } 
</script> 

또는을 (이것은 메가 해키)에 마지막 발현을 확인하여 javascript: 블록은 undefined입니다 :

<a href="#" onclick="$('#foo').dialog('open'); return false;">Click Me</a> 
<script> 
    $("#foo").dialog({autoOpen: false}); 
</script> 

을하지만 어떤 경우에, 강하게 후킹 일 추천 :

<a href="javascript:$('#foo').dialog('open');undefined;">Click Me</a> 
<script> 
    $("#foo").dialog({autoOpen: false}); 
</script> 

또는하여

는 onclick을 사용하여 DOM2 스타일의 이벤트 핸들러와 INGS :

<a href="#" name='openSesame'>Click Me</a> 
<script> 
    // This _can_ be immediately after the anchor, but I'd put it in 
    // a separate, since .js file for the page that you load just before 
    // the closing body tag. 
    $("#foo").dialog({autoOpen: false}); 
    $("a[name=openSesame]").click(function() { 
    $("#foo").dialog('open'); 
    return false; 
    }); 
</script> 

Live example (물론, 당신이 의미가 어떤 선택을 사용할 수 있습니다, 당신은 앵커를 제공하지 않는 name [또는 id].)

이것에 대한 좋은 점 중 하나는 앵커가 자바 스크립트가 비활성화 된 경우 (의미는 progressive enhancement) 사용자를 어딘가에서 의미 있고 유용하게 사용할 수 있다는 것입니다. href를에서 자바 스크립트를 넣어

<a href="javascript:void(0)" onclick="$('#foo').dialog('open')"> 
    Show dialogue box 
</a> 

제일 피하십시오 :

Answer 2

가에 대한 링크를 변경

. jquery를 통해 클래스에 click 이벤트를 추가하는 것보다 더 좋을 것입니다.