2013-06-03 33 views
1

我正在使用jQuery模式對話框,在對話框中我們嵌入了iframe。 iframe包含按鈕「顯示搜索結果」在IE8中,yepnope在第一次嘗試時不在iframe中加載資源

第一次嘗試「顯示搜索結果」按鈕時,沒有任何事情發生。 我的結果不是在表格中渲染(可能服務器請求沒有觸發)。

只有當我切換到瀏覽器的其他選項卡時,第二次顯示正確的表格纔會出現。

var __run = function(getData) { 
    yepnope({ 
     test : $.fn.flexigrid, 
     nope : [ 'www/css/flexigrid.css', '/www/javascripts/flexigrid.js'], 
     complete : getData 
    }); 

調用時第1次在IE8然後的getData(傳遞函數)__run功能應該執行,但無法執行它。

這具體到IE8

問題如何解決上述問題?任何快速建議?

在Firefox和Chrome等其他瀏覽器中一切正常。

如果我改變模式標誌爲「顯示搜索結果」按鈕單擊事件,我在IE8中得到的結果然後嘗試第一次,但我們需要多種形式對話所以這不是很好的解決方案。

myWindow.dialog({ 
       modal : false, 

更新加入jQuery UI的對話代碼

NewModalUI.popWindow = function($){ 
    var mWindow = null, mFrame; 
    var build = function(){ 
     mWindow = $('<div id="UI_modal" style="display:none"><iframe id="UI_modalFrame" name="UI_modalFrame" width="100%" height="97%" SCROLLING="auto" frameborder="0"></iframe></div>').appendTo($('body')); 
     mFrame = mWindow.find('iframe') 
    }; 
    var isReady = function(){ 
     return mWindow; 
    }; 
    var isVisible = function(){ 
     return (!mWindow.is(':hidden')) 
    }; 
    var close = function(){ 
     __log("Window closed ..."); 
     mFrame.attr('src', ''); 
     mWindow.dialog('close') 
    }; 
    var open = function(url){ 
     if(!isReady()){ 
      build() 
      mFrame.bind('load.modalWindow',function(){ 
       var $div = mFrame.contents().find('.submitContainerDiv'); 
       if($div.find('.submitBtns').find('input').length == 1){ 
        $div.hide() 
       } 
      }) 
      mFrame.attr('src', url) 
      mWindow.dialog({ 
       modal : true, 
       height: $(window).height()-100, 
       minHeight: '250', 
       maxHeight: '90%', 
       width:'80%', 
       minWidth : '50%', 
       maxWidth:'90%', 
       buttons : { 
        'Cancel':function(){ 
         $(this).dialog('close') 
        } 
       }, 
       beforeClose : function(){ 
        mFrame.attr('src', '') 
       } 
      }) 
     } 

     if(!isVisible()){ 
      mFrame.attr('src', url) 
      mWindow.dialog('open') 
     }else{ 
      mFrame.attr('src', url) 
     } 
    }; 
    return { 
     window: mWindow, 
     build : build, 
     isReady : isReady, 
     isVisible : isVisible, 
     close : close, 
     open : open 
    } 
}(jQuery); 

還觀察到IE8生成的html代碼

無論是IE8或yepnope加入onload事件與空值的腳本標記 屬性防爆。

<script src="/www/javascripts/flexigrid_faster.js" onload="null"></script> 

第二次起onload事件屬性值改變爲通過填充在網格yepnope &搜索結果加載的資源。例如,

<script src="/www/javascripts/flexigrid_faster.js" type="script" height="0" width="0" 

onload="function(){k.call(this,r)}"></script> 

希望獲得最佳解決方案。

+0

我認爲對話是有somekind的錯誤或miscon的成形。你可以更具體的對話JS代碼? – michalzuber

+0

@michalzuber感謝您的回覆。添加jquery對話框js代碼FYI。 在上面的jQuery對話框中是否有任何錯誤配置?如果是的話,讓我知道。 – StackOverFlow

+0

謝謝,我會建議添加分號應該是,在http://titanpad.com/X98Vd0cHcs – michalzuber

回答

0

我做了一個例子,在http://jsfiddle.net/uUpfg/應該不言自明我用jQuery 1.9.1和jQuery UI 1.9。2

HTML

<a href="#dlg" id="show-dlg">Show dialog</a> 
<div id="dlg" class="hide">I am the dialog ;)</div> 

的JavaScript

;(function ($, window, document, undefined) { 

    $('#show-dlg').on('click', function() { 

     var id = $(this).attr('href'); 

     $(id).dialog({ 
      bgiframe: true, 
      resizable: false, 
      draggable: false, 
      modal: true 
     }); 

     return false; 
    }); 


})(jQuery, window, document); 

CSS

.hide { 
    display: none; 
} 
+0

這是基本的jQuery UI模型對話示例。請參閱更新的問題。 – StackOverFlow

相關問題