jQuery Colorbox : ajax (전체 페이지가 아님)를 통해 단일 ID를로드하는 중 문제가 발생했습니다.

Question

#submit-text-form이라는 양식을 jQuery colorbox를 통해로드하려고합니다. 그러나 colorbox는 원래 링크가 타겟팅하는 전체 페이지를로드합니다. 나는 지침 here을 따라 갔지만 여전히 전체 페이지를로드 중입니다. 내가 뭘 잘못하고 있는지에 대한 아이디어가 있니?

$(function(){ 
$('#submit-link').colorbox({ 
opacity: 0.3, 
transition: 'fade', 
href: $("#submit-link").attr('href') + "#submit-text-form", 
}); 
}); 

Answer 1

이 시도 :

는

$(function(){ 
$('#submit-link').colorbox({ 
opacity: 0.3, 
transition: 'fade', 
href: $("#submit-link").attr('href') + " #submit-text-form", 
}); 
}) 

당신의 선택 " #submit-text-form 앞에 공백이있을 필요가있다. Colorbox는 ajax 처리를 위해 jQuery의 load() 메소드를 사용하므로 동일한 방식으로 작동합니다.

Answer 2

브라우저에서 직접 colorbox에 표시해야하는 페이지를 열면 페이지가 표시됩니다. 그렇지 않다면 여전히 전체 페이지를로드하고 한 부분을 표시하고, 아약스로 데이터를 가져와야하며, 성공하면 DOM 선택기로 필요한 부분을 가져온 다음 colorbox 안에 표시해야합니다. 이처럼

:

$.get($("#submit-link").attr('href'), 
    function(response) { 
     //Load the AJAX response into a jQuery variable 
     var $html = $(response); 
     //Get the portion which you need to show inside the colorbox 
     $html.find('#submit-text-form').colorbox({ opacity: 0.3, transition: 'fade'); 
     //Append it to body. (I didn't use colorbox before.) 
     $('body').append($html); 
}); 

주 : 내가 colorbox 전에 사용하지 않은, 그것을 테스트하지 못했지만, 이것이 내가 생각하는 당신이 원하는 방법입니다.