2014-09-12 82 views
0

我正在使用jquery toastr。到目前为止,一切都很好。我可以显示和关闭敬酒罚款。 我希望能够唯一标识每个烤面包。并在onHidden函数中使用该唯一标识符。有没有人做过这个?关闭toast封闭的toast的toastr类或div的关闭事件是更好的选择吗?jquery toastr on隐藏函数

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

回答

0

如果有人遇到这种情况,以后是我的解决方案。 从json加载的吐司。每个吐司都有自己独特的div(info,error,warning,succuess),每个吐司都有一个分配给它的类。我使用我需要的值在吐司中的每条消息中分配了隐藏属性。

 $.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及瓶坯我的逻辑发生

//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() { 
      } 
     }); 
}); 
5

您可以通过第三parmeter这是选项覆盖

toastr.error('Some error', 'Error', { onHidden: function() { 
     console.log('Error toast hidden.') 
}}); 

或修改全局onHidden

var onHiddenToast = function() { 
     console.log("onHidden"); 
} 
toastr.options.onHidden = onHiddenToast; 

也可以通过引用它

var myToast = toastr.info("Some info"); 
//do what you want with myToast 
+0

感谢抬头得到根本干杯!将考虑所有关于未来用途的内容! – phattyD 2014-09-18 00:57:30