jQuery Impromptu 訊息視窗
基本語法
$.prompt( msg , options )
整理出幾個基本常會用
的用法
// 1. 簡易訊息視窗
$.prompt('Example 1');
// 2.
OK,Cancel
$.prompt('Example 2',{ buttons: { Ok: true, Cancel: false }
});
// 3.
跳出訊息視窗時,會預設按鈕,傳統的訊息視窗會預設在確認按鈕上,此部分在警告流程中,使用者很喜歡這樣的方式
$.prompt('Example
4',{ buttons: { Ok: true, Cancel: false }, focus: 1 });
// 4.
此使用 prefix 屬性來改變 css
$.prompt('Example 5',{ prefix: 'impromptu' });
//
5. 加入顯示特效
$.prompt('Example 6',{ show:'slideDown' });
// 6.
顯示自訂樣式訊息視窗
var brown_theme_text = 'Example 13'+
'<p>
Save these settings?</p>'+
'<img src="images/help.gif"
alt="help" '+
'class="helpImg" />';
$.prompt(brown_theme_text,{
buttons:{Ok:true,Cancel:false},
prefix:'brownJqi'
});
//
7. 多步驟決定視窗
var statesdemo = {
state0: {
html:'test 1.<br/>test 1..<br/>test 1...',
buttons: { Cancel: false, Next: true },
focus: 1,
submit:function(v,m,f){
if(!v) return true;
else
$.prompt.goToState('state1');
return false;
}
},
state1: {
html:'test 2',
buttons: { Back: -1, Exit: 0 },
focus: 1,
submit:function(v,m,f){
if(v==0)
$.prompt.close()
else if(v=-1)
$.prompt.goToState('state0');
return false;
}
}
};
$.prompt(statesdemo);
以
上幾個是比較常用到的訊息視窗
參考資料來源:http://trentrichardson.com/Impromptu/index.php