Jquery dialog URL

方法一:http://www.cnblogs.com/tianxiangbing/archive/2010/09/13/jquery_dialog.html

調用方法如下:

$( " #dialog-confirm " ).openWidow({id: " abc " ,width: 440 ,height: 500 ,title: " 測試 " ,url: " test_url.asp " });

 

方法二:http://zhengcaihai529.javaeye.com/blog/728630

第二种方法更簡單,使用也更方便

需將jquery.ui.dialog.js改进：

1、dialog中加入参数传递

     常用情况是在界面中了某个值，打开的dialog需要传入这个值。所以修改dialog的options加入postParams，并且在dialog创建的时候读取参数放到url中（注意少许参数才可使用，对不同的浏览器url传参有限制）。修改如下

_create: function () {
this .originalTitle = this .element.attr( ' title ' );
// #5742 - .attr() might return a DOMElement
if ( typeof this .originalTitle !== " string " ) {
this .originalTitle = "" ;
}

this .options.title = this .options.title || this .originalTitle;

// update by zhengcaihai if iframe
if ( this .element && ( this .element[ 0 ].tagName.toLowerCase() == ' iframe ' ) && this .options.postParams){
var src = this .element.attr( " src " ),q = '' ;
var arr = this .options.postParams.split( " , " );
if (arr != null && arr != '' ){
for ( var n in arr){
q += $.param($( " # " + arr[n]).formToArray( true )) + " & " ;
}
this .element.attr( " src " ,src + ' ? ' + q);
}
}

var self = this ,
options = self.options,

調用代碼如下:

$( ' <iframe frameborder="0" /> ' ).dialog({
autoOpen: true ,
title : " 用戶登入 " ,
height: 200 ,
position: ' center ' ,
width: 440 ,
show: " explode " ,
hide: " highlight " ,
beforeClose: function () {
// TODO
}
}).width( 440 ).height( 200 ).attr( " src " , " test_url.asp " );