使用 jQuery Dialog 取后臺信息是非常簡單的,在此我們可以使用 Ajax 技術來實現。下面是一個使用 jQuery Dialog 取后臺返回信息的步驟:
$(document).ready(function (){ $( "#dialog-message" ).dialog({ autoOpen: false, modal: true, buttons: { Ok: function() { $( this ).dialog( "close" ); } } }); $( "#show-message" ).click(function() { $.ajax({ type: "POST", url: "example.com", data: { name: "John", location: "Boston" } }).done(function( msg ) { $( "#dialog-message" ).html( msg ); $( "#dialog-message" ).dialog( "open" ); }); }); });
上面的代碼中,我們使用到了 jQuery 及 jQuery UI 庫,同時也引入了一個外部的頁面“example.com” 作為演示用的返回信息。我們綁定了一個按鈕( "#show-message" ) 的單擊事件,單擊后即通過 Ajax 調用外部頁面返回信息。之后獲取到信息后,將信息插入到一個 div ( "#dialog-message" ) 中,并將該 div 顯示為一個 jQuery Dialog。
在開發時,我們可以根據自己的需求和實際情況來調整代碼,使其更符合我們的要求。