使用可选的自定义功能 onclick 扩展单个 toastr 创建

Posted 2023-05-08

【中文标题】使用可选的自定义功能 onclick 扩展单个 toastr 创建

【英文标题】：Extend single toastr creation with optional custom function onclick

【发布时间】：2013-09-10 18:39:14

【问题描述】：

我收到了关于点击toast 时如何反应的消息，所以我决定在这里发布给大家。

当用户点击toast 时，我并不总是希望消息消失，而是取决于我想要的消息类型：

消失。 将用户重定向到不同的页面 (x es /meetings/210) 显示jquery 对话框（例如：显示收到的短信）。

使用基本点击事件我无法检测到我点击的toast。 我发现的唯一解决方法是在 toast 中添加一个链接，并在用户单击它时进行重定向。

所以我要问的是一种通过使用基本点击事件来获取用户点击的当前 toast 的方法（但这可能需要更多的工作在 toast 中隐藏数据以在点击时恢复它以了解该怎么做)，或者通过向创建 toast 的函数添加单击时对函数的可选回调，如下所示：

toastr.error(
'body text', 
'header text', 
click: function() 
console.log('you clicked on the error toaster')

);

感谢您提供这个非常好的图书馆。

【参考方案1】：

这已经建好了。您可以通过两种方式做到这一点：您可以获取包含单个 toastr 元素的 jQuery 对象，或者您可以为单个 toast 设置 onclick 事件。您的代码正在为第三个参数传递一个函数。第三个参数应该是选项覆盖。所以它应该是这样的：

toastr.error('body text', 'header text', 
    onclick: function() console.log('you clicked on the error toaster')
);
toastr.info('body text 1', 'header text', 
    onclick: function() console.log('you clicked on the info toaster n.1')
);

【讨论】：

不幸的是，这并不能阻止消息消失...在调用 onClick 方法后的 toastr.js 中，hideToast() 方法如下。我现在的想法是从 onClick 方法返回布尔结果，如果它是错误的 - 然后保持消息打开。不过，也许您可​​以提出更好的方法？ :))

我认为这也应该在文档中。我知道它在签名中，但是 github 页面上的一个例子会很好 - 也许我应该编辑并做一个 PR :)