我试图在点击 div 后更改 toast 的 positionclass 位置类,但是它没有改变到底部。我错过了什么吗?
还有,如何使用 toastr.optionsOverride = 'positionclass:toast-bottom-full-width';
@{
ViewBag.Title = "Index";
}
<h2>Index</h2>
<head>
<title></title>
<script type ="text/javascript" src ="@Url.Content("~/Scripts/jquery-1.6.4.js")"></script>
<script type ="text/javascript" src ="@Url.Content("~/Scripts/toastr.js")"></script>
<link rel="stylesheet" type="text/css" href="~/content/toastr.css" />
</head>
<script type="text/javascript">
$(document).ready(function () {
// show when page load
toastr.info('Page Loaded!');
$('#linkButton').click(function () {
toastr.optionsOverride = 'positionclass:toast-bottom-full-width';
// show when the button is clicked
toastr.success('Click Button', 'ButtonClick', 'positionclass:toast-bottom-full-width');
});
});
</script>
<body>
<div id ="linkButton" > click here</div>
</body>
更新1
经过调试,我注意到toastr.js中的以下getOptions方法正在将'positionclass:toast-bottom-full-width'覆盖为'toast-top-right'
function getOptions() {
return $.extend({}, defaults, toastr.options);
}
更新2: toastr.js中第140行无法成功将m optionsOverride扩展为options。??
if (typeof (map.optionsOverride) !== 'undefined') {
options = $.extend(options, map.optionsOverride);
iconClass = map.optionsOverride.iconClass || iconClass;
}
更新3 职位问题已经解决,但我不得不如下三次提及职位类。我确信有一种更简洁的方法来完成这个任务。
$('#linkButton').click(function () {
toastr.optionsOverride = 'positionclass = "toast-bottom-full-width"';
toastr.options.positionClass = 'toast-bottom-full-width';
//show when the button is clicked
toastr.success('Click Button', 'ButtonClick', 'positionclass = "toast-bottom-full-width"');
});
toastr.options = { "showDuration": "20000", }
。 - wilblack2.0.2
存在一个问题,即在某些情况下不会尊重positionClass
:请参见 GitHub 上的问题。这个问题已经在2.0.3
中得到修复,但是在我撰写此评论时,还没有发布2.0.3
版本。 - Doctor Blue