subModal 回调函数和添加title示例

subModal  是一个非常漂亮好用的跨游览器的模态对话框。不用担心会被游览器拦截。我在使用过程中，发现官方网站上对该对话框的回调函数解释的不明朗。google了一下英文，也没有清楚的，于是自己写一个，方便大家查找。发到论坛里面，主要是为了

在搜索引擎里面，能够被找到。

 

这个是官方的说明，详细可参见http://sublog.subimage.com/articles/2007/01/11/using-the-callback-function-on-the-submodal

UsingCallbackFunction
Using callback functions with SubModal

1. Define the function that’ll be called on the opening page.
2. Pass the function you’d like to call into 'showPopWin'.
3. Assign any return value on the modal page itself, if necessary
4. Call the hidePopWin function passing true

It might be easier to grok in code, so here's an example:

On the SubModal opening page

// returnVal can get passed in from the modal page itself... //....see below for info function returnRefresh(returnVal) {   window.document.reload(); } // Open the modal, passing in the refresh function // as a reference NOT a string. showPopWin('mymodal.html', 500, 500, returnRefresh);

From inside the SubModal window
// If you plan to pass a return value assign it var returnVal = "something"; // When you're ready to close the pop window // call this...Passing true makes sure the return // function gets called. window.top.hidePopWin(true); 

经本人实验，如果要从模态对话框中成功传回数据：
 
在弹出的对话框中页面，回传的值必须是全局变量，例子中的就是
var returnVal = "something";
的必须是全局变量.
附带说明一下，经过实验，发现subModal 约定了返回回调函数的变量必须是returnVal ，也就是说，在弹出对话框中：
要传回回调函数的变量名称必须是returnVal ，同时，回调函数中的参数名称也必须是returnVal，也就是说，如果你写了
这么个例子：
SubModal window

var returnVal2 = "something";

Parent window
function returnRefresh(returnVal) {
  alert(returnVal);
}
或者这样一个例子：
SubModal window
var returnVal = "something";
 
 

Parent window
function returnRefresh(returnVal2) {
  alert(returnVal);
}
 
或者：
SubModal window
var returnVal2 = "something";
Parent window
function returnRefresh(returnVal2) {
  alert(returnVal);
}
 
都会返回undefined
 
 
第二个问题，如何给弹出的对话框加标题：
如果你是使用JQuery 问题就很简单，在你使用showPopWin() 函数之后，
紧接着调用$('#popupTitle').text('Some new Title');  
如果不使用JQuery，用这个也行
document.getElementById('popupTitle').innerHTML="Some new Title";
 
因为subModal实现的对话框，实际上是通过javascript生成了如下的代码：
<div id="popupContainer"> <div id="popupInner"> <div id="popupTitleBar"> <div id="popupTitle"></div> <div id="popupControls"> <img src="close.gif" onclick="hidePopWin(false);" /> </div> </div> <iframe src="loading.html" style="width:100%;height:100%;background-color:transparent;" scrolling="auto" frameborder="0" allowtransparency="true" id="popupFrame" name="popupFrame" width="100%" height="100%"> </iframe> </div> </div>
 
 
我做了例子在附件里面。

 
 

  
  

    
      
        

          
subModal-1.6-example.rar (8.4 KB)
          
描述: 回调函数，和添加title的例子。
解压后，运行index.html
          
下载次数: 441
        
      
    
    
  



  

    
    
分享到：
      
      
    
  

  

    

      SourceOffSite 3.5.3
      |
      javaScript 递归
    
  
  

    

      
2008-08-28 12:34
      
浏览 4245
      
评论(1)
       
论坛回复 / 浏览 (1 / 3678)
 
      
      
分类:Web前端
      
      
查看更多
    
    
  
    
  

    
评论
    
    

  

    1 楼
    comasp
    2008-08-28  
    
    
  
  
感觉不太好，打开的时候，有点闪。。。IE7下。