2013-08-29 73 views
0

我學習Jquery的模態形式例如:我可以從文件A打開模態窗口並在模態窗口上顯示文件B嗎?

http://jqueryui.com/dialog/#modal-form

是否有可能從文件中的打開一個模式窗口和模態窗口上顯示現有的文件B?

感謝的提前

+0

您是否在討論打開模式,然後從不同的文件加載該模式的內容?我相信你可以使用'open'事件來做一個'.load()'或'.ajax()'調用。 – DevlshOne

+0

是的,我需要來自不同文件的內容,就像在模式中使用iframe一樣。 –

回答

1

HTML

<div id="dialog_form"></div> 

jQuery的

$('#create-user').click(function() { 
    $('#dialog_form').dialog(
    { 
     open: function() { 
      $(this).load('form_new.html'); 
     }, 
     modal: true 
    } 
    ); 
    $('#dialog-form').dialog('open'); 
}); 
+0

我試圖添加此代碼在一個按鈕調用中單擊$(「#create-user」) .button() .click(function(){0>'#dialog-form')。 ({ \t \t \t開:函數(){$ (本).load( 'form_new.html');} , \t \t \t模式:真 \t \t}); });'的按鈕現在不打開模式,可能是一些語法錯誤?對不起,我是Jquery的新手 –

+1

@ÂngeloRigo試試這個。 – DevlshOne

+0

我工作的唯一代碼是: '$(「#create-user」) .button() .click(function(){(「#dialog-form」).dialog(「open」 ); });' –

1

你可以做這樣的事情:

HTML:

<a href="#" id="showDialog">Show dialog</a> 
<div id="dialog"></div> 

的jQuery:

$(function() { 
    $("#dialog").load("fileb.html").dialog({autoOpen: false}); 
    $('#showDialog').click(function() { 
     $("#dialog").open(); 
     return false; 
    }); 
}); 

如果fileb.html是一個完整的網頁,您可能希望將iframe附加到$("#dialog")。另外,您可以在對話框的打開事件中執行追加或加載。

備用jQuery的是採用了開放式的事件:

$(function() { 
    $("#dialog").dialog({ 
     autoOpen: false, 
     open: function() { 
      $(this).load("fileb.html"); 
     } 
    }); 

    $('#showDialog').click(function() { 
     $("#dialog").open(); 
     return false; 
    }); 
}); 
+0

編輯我的答案以顯示完整示例。 – zigdawgydawg

1

是不是有目標文件名的方式,已在cl中定義可怕的鏈接或按鈕..而不是必須在腳本本身定義它? 例如... 當一個環節都有類似:

<a href="#" class="CLICKCLASS" name="filename">click me</a> 

代碼觸發模式:

$(function() { 
     $(".CLICKCLASS").load("INFO_FROM_NAME_ATTRIBUTE").dialog({autoOpen: false}); 
     $('.CLICKCLASS').click(function() { 
      $("#dialog").open(); 
      return false; 
     }); 
    }); 

我不知道哪個屬性可用於,但是,這個會使腳本打開在每個需要加載模式框的鏈接或按鈕中使用