jQuery Toastr onHidden函数 [英] Jquery toastr onHidden function
问题描述
我正在使用jQuery Toastr.到目前为止,一切都很好.我可以展示和关闭敬酒. 我希望能够唯一地识别每个吐司.并在onHidden函数中使用该唯一标识符.有人做过吗?是否有更好的选择在关闭事件上为封闭的吐司周围的toastr类或div调用jquery?
I am using jquery toastr. So far everything is great. I can display and close toasts fine. I want to be able to identify each toast uniquely. And use that unique identifier in the onHidden function. Has anyone done this before? Is the better option to call a jquery on close event for the toastr class or div surrounding the closed toast?
var mes = 'My name is Inigo Montoya.<input type="hidden" id="announcementId" value="1"/>' +
'<input type="hidden" id="userId" value="'+ userid +'"/> ';
var mes1 = 'Princess Bride<input type="hidden" id="announcementId2" value="2"/>'+
'<input type="hidden" id="userId1" value="'+ userid +'"/> ';
var mes2 = 'Man in Black<input type="hidden" id="announcementId2" value="3"/>'+
'<input type="hidden" id="userId2" value="'+ userid +'"/> ';
var mes3 = 'Inconcivable!<input type="hidden" id="announcementId3" value="4"/>'+
'<input type="hidden" id="userId3" value="'+ userid +'"/> ';
toastr.options = {
"closeButton": false,
"debug": false,
"positionClass": "toast-top-full-width",
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "0",
"extendedTimeOut": "0",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut"
};
toastr.options.onHidden = function(item) {
//GET UNIQUE TOAST ID'S HERE
var val = 1;//$this.find("#announcemntId").val();
alert("CLOSED " + item);
}
toastr.error(mes, "First Toast");
toastr.error(mes1, "Second Toast");
toastr.error(mes2, "Third Toast");
toastr.error(mes3, "Fourth Toast");
推荐答案
以防万一,稍后有人遇到这是我的解决方案. 从json加载吐司.每个吐司都在其自己的唯一div(信息,错误,警告,成功)内,并且每个都分配有一个类.我在祝酒词中的每条消息中都分配了我需要的隐藏属性.
In case anybody runs across this later here was my solution. Loaded toasts from json. Each toast is inside its own unique div (info, error, warning, succuess) and each has a class assigned to it. I assigned hidden attributes in each message in the toast with values I needed.
$.ajax({
dataType: "json",
url: '/announcements/getannouncements/userid/' + userid,
success: function (data) {
$.each(data, function (i, val) {
var mes = '<input type="hidden" id="userId" value="' + userid + '"/>' +
'<input type="hidden" id="announcementId" value="' + val.id + '"/>' +
'Client: ' + val.client + '</br>' + val.announcement;
var title = val.title;
toastr.error(mes, title); //info, success, warning, error
});
},
error: function () {
alert("Could not get announcments");
}
});
由于关闭吐司是在单击div时发生的,因此我可以捕获被单击的div类,找到公告和用户ID并执行我的逻辑
Since closing the toast happens when you click on the div I could capture the div class that was clicked on, find the announcement and user id and preform my logic
//class could be warning, error, info, success : we only use error
$(".toast-error").live('click', function () {
var userId = $(this).find("#userId").val();
var announcementId = $(this).find("#announcementId").val();
var url = '/announcements/acknowledge/userid/' + userId + '/announceid/' + announcementId;
// ajax call to the controller to write the timestamp of the user clicking the toast announcement
$.ajax({
dataType: "json",
url: url,
success: function (data) {
if (data == '1') {
alert("Successfully acknowledged");
}
else {
alert("Data error");
}
},
error: function () {
}
});
});
这篇关于jQuery Toastr onHidden函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!