Question

你好我可以请一个使用js小提琴的工作示例来显示一个显示toast的成功消息。我无法绑定toast并将其包含在我的网页中。如果有人能解释如何在jsp页面中点击按钮显示祝酒消息，我将感谢你。感谢

Answer 1

使用 Toastr ，请参阅demos。

在head标签中，添加css：

<head>
    <link href="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" rel="stylesheet" />
</head>

在body标签中，添加js文件：

<body>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js" ></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
    <script>$('#invokesToastMessage').click(function () { toastr.success('message', 'title'); });</script>
</body>

之后，只需使用，试试：

<button id="invokesToastMessage">

Answer 2

toastr大约需要 90KB ，我建议您尝试使用这种轻巧简单的ToastMaker库，该库的大小仅为 1KB 。

$('#mybutton').click(()=>{ToastMaker("This is a toast notification!")});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<link rel="stylesheet" type="text/css" href="https://unpkg.com/toastmaker/dist/toastmaker.min.css">

<script type="text/javascript" src="https://unpkg.com/toastmaker/dist/toastmaker.min.js"></script>


<button id="mybutton">Show Toast</button>

在jsp页面中显示toast消息

2 个答案: