页面中需要在右下角弹出提示信息需要用jquery的messager插件,参考http://docs.wex5.com/prompt-message/
show方法弹出的信息可以用html标签组成,那么标签中就可以写事件
如果标签中要显示data中数据,并且在事件要调用model中的js方法以及传data中做参数,参考如下:
本例是遍历data中的数据,在messagr中显示数据fName的值,并且在a标签的click事件中调用model下的方法并把data中的rowid做参数传递过去
Model.prototype.button35Click = function(event) {
var data = this.comp("data5");
var message = "";
//遍历data拼接要显示的信息,a标签中定义的class要唯一,方便后面给标签绑定事件,
//rowid是自定义属性后面的click中会获取到属性值做参数传给model的js方法
data.each(function(option){
message += "<p><span>"+option.row.val("fName")+"</span><a class='messagerA' rowid='"+option.row.getID()+"'>详情</a></p>"
});
$.messager.lays(500, 300);
$.messager.anim('show', 1000);
var self = this;
$.messager.show("<font color=red>工作提醒</font>",message , 50000);
$(document).on('click','.messagerA',function(event){//给所有messagerA样式的标签绑定click事件,并获取
var rowid = event.currentTarget.getAttribute("rowid");
self.test(rowid);//调用model的test方法
});
};
Model.prototype.test = function(rowid) {
alert(rowid);
}
需要注意的是这种挂事件的方式需要在页面离开时把事件取消,可以在model的onunLoad事件中处理,并且把提示框关闭,防止设置show中设置的时间长时在页面关闭时间还没到提示框还显示的问题,具体如下处理
Model.prototype.modelUnLoad = function(event){
$(document).off('click','.messagerA');
$("#message_close").click();
};
评一波