jquery-ui模态框动态修改标题和提示内容

hyx 2019-09-05 10:49:15 74次 0 0

jquery-ui的使用文档介绍的模态框的标题和和提示的内容都是事先写好的,里面没有动态修改标题和提示的方法,也没有对应参数的介绍,本人第一次使用jquery-ui,也没有深入探讨,模态框的提示内容只好根据class通过DOM动态修改了,现在先做个记录,以便下次遇到给忘了。


<div id="dialog-message">
	
	<p class="dialog-title">
		<span class="ui-icon ui-icon-circle-check"></span> 您的文件已经成功下载到文件夹中。
	</p>

	<p class="dialog-content">
		当前使用存储空间的 36%
	</p>

</div>

<div id="dialog-message2">
	
	<p class="p1 dialog-title">
		<span class="ui-icon ui-icon-alert"></span> <span class="dialog-cont">很抱歉,您提交的预约发生了意外,请重新提交预约</span> 
	</p>

</div>


//确认框
$("#dialog-message").dialog({
    autoOpen: false,
    width:380,
    modal:true,
    buttons: {
        Ok: function() {
            $( this ).dialog( "close" );
        }
    },
    show: {
        effect: "drop",
        duration: 500
    },
    hide: {
        effect: "fade",
        duration: 500
    }
});
//警告框
$( "#dialog-message2" ).dialog({
    autoOpen: false,
    width:380,
    modal:true,
    show: {
        effect: "drop",
        duration: 500
    },
    hide: {
        effect: "fade",
        duration: 500
    }
});
/*警告框,动态修改标题,提示内容,打开模态框,因为不知提示内容的参数名,暂时通过DOM修改提示内容,content和text都不是对应的参数名*/
function tips2(message,title) {
    title=typeof title ==='undefined' ? "温馨提示":title;
    $( "#dialog-message2 .dialog-cont").text(message);
    $( "#dialog-message2").dialog({
        title: title
    }).dialog('open');
}




0

发表评论

注:*为必填

回复 的评论
*
选择
*
*

类似文章