>  기사  >  웹 프론트엔드  >  jquery의 대화 상자 플러그인을 프레임 페이지(iframe)_jquery로 수정하는 방법

jquery의 대화 상자 플러그인을 프레임 페이지(iframe)_jquery로 수정하는 방법

WBOY
WBOY원래의
2016-05-16 18:19:441078검색

jquery에는 아주 좋은 UI 플러그인, 대화 플러그인이 있으며 공식 웹사이트에서 다양한 형태의 데모를 볼 수 있습니다. http://jqueryui.com/demos/dialog/ 어쩌면 모두가 더 자주 사용하는 것이 기본 모드일 것입니다. 구체적인 지침은 판사 웹사이트에서 확인할 수 있으며, 중국어로 된 설명 주소도 있습니다. 최근에는 팝 작업을 하고 있습니다. -up 프레임 페이지를 자세히 살펴보면 대화 플러그인 모달 형식 모드가 매우 유사하며 데모 효과는 http://www.lovewebgames.com/addNews입니다. aspx
jquery의 대화 상자 플러그인을 프레임 페이지(iframe)_jquery로 수정하는 방법
이 효과는 로그인이 필요합니다. 팝업 레이어를 등록해야 하는데 왜 모달 형식만 사용하지 않는 걸까요? 내가 좋아하기 때문에 당신은 나를 통제합니다. 그래서 원본 대화 파일을 참조해야 하는 jquery 아래 대화 상자용 플러그인을 만들었습니다. 구체적인 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

(함수($) {
$.fn.openWidow = 함수(옵션) {
var divId = "dialog" Math.round(Math.random() * 100);
var 설정 = {
id: divId ,
너비: 300,
높이: 200,
모달: true,
버튼: {
},
표시: "폭발",
hide: "highlight" ,
title: "Prompt",
url: "/test.aspx",
close: function () {
$("#" this.id). 제거();
//디버거
if (document.getElementById(this.id))
document.body.removeChild(document.getElementById(this.id))
}
};
if (옵션) {
$.extend(settings, options)
}
$("body").append('

');
// 대화상자
$('#' settings.id) .dialog({
autoOpen: false,
제목: settings.title,
너비: settings.width,
높이: settings.height,
모달: true,
bgiframe: true,
표시: settings.show,
숨기기: settings.hide,
버튼: settings.buttons,
닫기: settings.close,
열기: 함수() {
$("#" 설정 .id).html('