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");