我有一个单击按钮的脚本,它会弹出一个带有褪色背景的模态窗口。我想要实现的目的是将它包含在条件语句中,我脚本的后面部分如下所示
if (result != $version) { alert ('Your version is out of date') } } })
alert ('You are welcome back')
但是我想将警报更改为模态窗口,但无法通过
找到我的方式// JavaScript Document
$(document).on("pagecreate", function () {
$(".about").on("click", function () {
// 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> hello folks, good evening</p>";
// Popup body - set width is optional - append button and Ajax msg
var popup = $("<div/>", {
"data-role": "popup"
}).css({
width: $(window).width() / 0 + "px",
padding: 5 + "px"
}).append(closeBtn).append(content);
// Append it to active page
$.mobile.pageContainer.append(popup);
// Create it and add listener to delete it once it's closed
// open it
$("[data-role=popup]").popup({
dismissible: false,
history: false,
theme: "b",
/* or a */
positionTo: "window",
overlayTheme: "b",
/* "b" is recommended for overlay */
transition: "pop",
beforeposition: function () {
$.mobile.pageContainer.pagecontainer("getActivePage")
.addClass("blur-filter");
},
afterclose: function () {
$(this).remove();
$(".blur-filter").removeClass("blur-filter");
},
afteropen: function () {
/* do something */
}
}).popup("open");
});
});
答案 0 :(得分:1)
最简单的方法是触发条件中的点击:
if (result != $version) {
$(".about").trigger("click");
}
但是,我重构了对指定函数的单击回调,并且能够在条件和按钮的两个实例上调用它:
var openModal = function () {
// 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> hello folks, good evening</p>";
// Popup body - set width is optional - append button and Ajax msg
var popup = $("<div/>", {
"data-role": "popup"
}).css({
width: $(window).width() / 0 + "px",
padding: 5 + "px"
}).append(closeBtn).append(content);
// Append it to active page
$.mobile.pageContainer.append(popup);
// Create it and add listener to delete it once it's closed
// open it
$("[data-role=popup]").popup({
dismissible: false,
history: false,
theme: "b",
/* or a */
positionTo: "window",
overlayTheme: "b",
/* "b" is recommended for overlay */
transition: "pop",
beforeposition: function () {
$.mobile.pageContainer.pagecontainer("getActivePage")
.addClass("blur-filter");
},
afterclose: function () {
$(this).remove();
$(".blur-filter").removeClass("blur-filter");
},
afteropen: function () {
/* do something */
}
}).popup("open");
};
$(document).on("pagecreate", function () {
$(".about").on("click", openModal);
});
并在条件中:
if (result != $version) {
openModal();
}