Gok*_*l M 1 javascript jquery angularjs toastr angular-toastr
我有一个页面,其中可能toasts
使用插件https://github.com/CodeSeven/toastr动态添加了多个页面。
单击该链接时,我在每个祝酒词上都有一个link
(确定),我只需要关闭特定的(toast
不是全部)toast
可见的即可。
toastr.warning("You are warned. <br/> <a id='close-toastr'> Ok </a>", {
tapToDismiss: false
, timeOut: 0
, extendedTimeOut: 0
, allowHtml: true
, preventDuplicates: true
, preventOpenDuplicates: true
, newestOnTop: true
});
$('body').on('click', 'a#close-toastr', function ()
toastr.clear();
});
Run Code Online (Sandbox Code Playgroud)
在上面的代码中,我使用了toastr.clear()
清除所有吐司的方法。
谁能帮我识别一下toast
“ OK” link
并仅清除该吐司吗?
更新#1:
我尝试了@imjosh给出的答案,但是$(this).closest('.toast')
找到了正确的吐司,但toastr.clear($(this).closest('.toast'));
没有关闭任何吐司。
如果我将烤面包存储object
在一个变量中,并将其作为参数传递给toastr.clear()
它,那么它将起作用。但是,我不知道如何以这种方式处理多个吐司。
var toast = toastr.warning("You are warned. <br/> <a id='close-toastr'> Ok </a>", {
tapToDismiss: false
, timeOut: 0
, extendedTimeOut: 0
, allowHtml: true
, preventDuplicates: true
, preventOpenDuplicates: true
, newestOnTop: true
});
$('body').on('click', 'a#close-toastr', function ()
toastr.clear(toast);
});
Run Code Online (Sandbox Code Playgroud)
更新#2:
抱歉,我使用的不是我上面提到的那种https://github.com/Foxandxss/angular-toastr插件。
谢谢。
toastr.options = {
tapToDismiss: false
, timeOut: 0
, extendedTimeOut: 0
, allowHtml: true
, preventDuplicates: true
, preventOpenDuplicates: true
, newestOnTop: true
, closeButton: true
, closeHtml: '<button class="btn" style="background-color: grey; padding: 5px;">OK</button>'
}
toastr.warning("You are warned");
toastr.warning("You are warned 2");
Run Code Online (Sandbox Code Playgroud)
https://jsfiddle.net/3ojp762a/3/
或者,以某种尝试的方式进行操作(如果出于某些原因需要这样做):
toastr.warning("You are warned. <br/> <a class='close-toastr'> Ok </a>", "", {
tapToDismiss: false
, timeOut: 0
, extendedTimeOut: 0
, allowHtml: true
, preventDuplicates: true
, preventOpenDuplicates: true
, newestOnTop: true
});
toastr.warning("You are warned2. <br/> <a class='close-toastr'> Ok </a>", "", {
tapToDismiss: false
, timeOut: 0
, extendedTimeOut: 0
, allowHtml: true
, preventDuplicates: true
, preventOpenDuplicates: true
, newestOnTop: true
});
$('.close-toastr').on('click', function () {
toastr.clear($(this).closest('.toast'));
});
Run Code Online (Sandbox Code Playgroud)
https://jsfiddle.net/esgrwznu/
如果想从另一个事件中关闭 toastr(不仅仅是单击)
$('.close-toastr').closest('.toast').remove();
Run Code Online (Sandbox Code Playgroud)