我正在尝试将 jqm 对话框上的关闭按钮更改为 X 以外的其他按钮。我不能为此使用 CSS,因为我不希望每次都应用它,所以我正在寻找一种使用 jquery 来实现此操作的方法。有问题的对话框是选择菜单 http://api.jquerymobile.com/selectmenu/具有多项选择
我想修改图标的原因是关闭按钮可能会让用户感到困惑,不知道他的选择是否会被清除(因为它是多重选择)。
这是我尝试过的方法,但不适用于移动设备:
$('#MySelect-button').unbind('click').bind('click', function () {
var iconBtn;
$('#MySelect').selectmenu("open");
iconBtn = $('#MySelect-menu').closest('div.ui-selectmenu, div.ui-dialog-contain')
.find('div.ui-header span.ui-icon-delete')
.addClass('ui-icon-check')
.removeClass('ui-icon-delete');
iconBtn.closest('a').attr('title', 'Done');
$('#MySelect').selectmenu("refresh");
});
选择菜单实际上有一个选项“图标”,但它不是关闭选项图标。
我的jqm版本是1.2.1
这是一个简单的解决方法:
$(document).on("pageinit", "#page1", function(){
$("#MySelect-button").on("click", function(){
setTimeout(ChangeIcon, 50);
});
});
function ChangeIcon(){
$('.ui-popup-active a[data-icon=delete], .ui-dialog a[data-icon=delete]').buttonMarkup({ icon: "check"}).prop("title", "done");
}
单击选择按钮会默认启动弹出窗口或完整对话框,具体取决于项目数量。经过短暂的延迟后,我们运行 ChangeIcon 函数,该函数更新 A 标记的 buttonMarkup 以更改图标并更新 title 属性以提供“完成”工具提示。选择器的第一部分负责弹出场景,而第二部分负责对话框场景。
这里有一个DEMO http://jsfiddle.net/ezanker/mS8Rp/1/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)