[英]Call div inside a function
我正在嘗試使用jQuery mobile 1.4.3創建類似於iOS警報視圖的彈出窗口。 我需要從javascript事件中觸發警告消息,例如帶有OK按鈕的確認消息,其中顯示了對Web服務的ajax響應調用。
我的第一個問題是通過彈出窗口小部件傳遞數據,而我發現很多搜索都是不可能的。
我發現幾乎可以滿足我的代碼需求:
$('#index').live('pagebeforeshow',function(e,data){
$("#test-button").bind('click',function(event, ui){
$('<div>').simpledialog2({
mode: 'button',
headerText: 'Dialog',
buttonPrompt: 'Please, don\'t ruin my blue world',
buttons : {'close': {click: function() {}}},
width: '120px'
})
});
});
問題是我需要不是通過單擊按鈕而是通過函數來調用此函數:像這樣:
//POPUP CODE
// 1 == warning green
// 2 == warning yellow
// 3 == warning red
function customAlert(message, typeOfWarning){
if(typeOfWarning == "1"){
var auxStr = "green";
};
if(typeOfWarning == "2"){
var auxStr = "yellow";
};
if(typeOfWarning == "3"){
var auxStr = "red";
};
$('<div>').simpledialog2({
mode: 'button',
headerText: 'Dialog',
buttonPrompt: 'Please, don\'t ruin my blue world',
buttons : {'close': {click: function() {}}},
width: '120px'
})
};
我是JavaScript和jQuery Mobile的新手,需要幫助,無法正常工作。
提前致謝。
jQuery Mobile的Popup小部件具有多種操作方式。 可以通過按鈕調用或以編程方式打開它。 結構很簡單,但是請注意,只有頁面div應該是彈出窗口的直接父級。
<div data-role="page">
<div data-role="popup" id="foo">
<!-- content -->
</div>
</div>
要通過按鈕或錨點將其靜態打開,請執行以下操作:
<a href="#foo" data-rel="popup" data-transition="pop">Popup</a>
以編程方式打開它:
$("#foo").popup("open");
此外,您可以將特殊事件用於任何您想要的目的,例如popupafteropen
和popupafterclose
。
以下是動態創建的彈出窗口的示例。
// close button
var closeBtn = $('<a href="#" data-rel="back" class="ui-btn-right ui-btn ui-btn-b ui-corner-all ui-btn-icon-notext ui-icon-delete ui-shadow">Close</a>');
// text you get from Ajax
var content = "<p>Lorem ipsum dolor sit amet, consectetur adipiscing. Morbi convallis sem et dui sollicitudin tincidunt.</p>";
// Popup body - set width is optional - append button and Ajax msg
var popup = $("<div/>", {
"data-role": "popup"
}).css({
width: $(window).width() / 1.5 + "px",
padding: 5 + "px"
}).append(closeBtn).append(content);
// Append it to active page
$.mobile.pageContainer.pagecontainer("getActivePage").append(popup);
// Create it and add listener to delete it once it's closed
// open it
$("[data-role=popup]").on("popupafterclose", function () {
$(this).remove();
}).on("popupafteropen", function () {
$(this).popup("reposition", {
"positionTo": "window"
/* custom position
x: 150,
y: 200 */
});
}).popup({
dismissible: false,
history: false,
theme: "b",
/* or a */
overlayTheme: "b",
/* or a */
transition: "pop"
}).popup("open");
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.