查找并清除吐司（Toastr）

Question

我有一个页面，其中可能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();
});

在上面的代码中，我使用了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);
});

更新＃2：

抱歉，我使用的不是我上面提到的那种https://github.com/Foxandxss/angular-toastr插件。

谢谢。

Answer 1

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");

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'));
});

https://jsfiddle.net/esgrwznu/

Answer 2

如果想从另一个事件中关闭 toastr（不仅仅是单击）

$('.close-toastr').closest('.toast').remove();