워드 프레스 용 이미지 슬라이더 플러그인을 만들려고합니다. 제가하고 싶은 것 중 하나는 이미지를 클릭 할 때 전체 화면이되도록 만드는 것입니다.
페이지가로드시 모든 전체 크기 이미지를로드해야하는 것을 피하기 위해 사용자가 이미지를 클릭 할 때 jquery ajax 함수를 호출하고 싶습니다.
따라서 플러그인은로드 할 이미지를 알고 있으며, 함수는 해당 이미지에 대한 wordpress의 첨부 ID 매개 변수를 취하므로 링크는 다음과 같습니다.
<a href='javascript:void(0)' onClick='fullscreen(123)'><img src="previewimage" /></a>
… 기본적으로 ID 123의 이미지를 가져 와서 표시하는 것입니다.
작동하지 않는 jQuery는 다음과 같습니다.
(function($) {
$.fn.fullscreen = function(id) {
stage = $('#template-to-place-image-in');
stage.css('display', 'block');
$.ajax({
// a bunch of ajax parameters that get the image with the requested id and then place it into the template
});
event.preventDefault();
return false;
};
}(jQuery));
주요 문제는 미리보기 이미지를 클릭하려고 할 때 자바 스크립트 콘솔에서 다음과 같은 오류가 발생한다는 것입니다.
Uncaught ReferenceError: fullscreen is not defined
나는 자바 스크립트와 jquery를 처음 접했기 때문에 이것이 매우 간단한 구문 문제라고 생각하지만 내가 뭘 잘못하고 있는지 전혀 모릅니다. 누군가 도울 수 있다면 그것은 굉장 할 것입니다 :)
$.fn당신 과 함께 jQuery에 대한 추가 기능을 만들고 있습니다. 을 사용하여 액세스 할 수 있습니다 $(mySelector).fullscreen().
이 경우 jQuery 함수를 만들 필요가 없습니다. 다음 자바 스크립트 코드를 사용하세요.
(function($) {
window.fullscreen = function(id) {
var stage = $('#template-to-place-image-in');
stage.css('display', 'block');
$.ajax({
// a bunch of ajax parameters that get the image with the requested id and then place it into the template
});
event.preventDefault();
return false;
};
}(jQuery));
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다