javascript - Toastr:第一次单击按钮时不会应用 toast-top-center-6ren

javascript - Toastr:第一次单击按钮时不会应用 toast-top-center

转载作者：行者123 更新时间：2023-11-28 05:31:10

24

4

当我点击按钮时，消息显示在右上角。只有经过一两次尝试，它才位于顶部中心。但是当提交表单时，它应该在第一次点击时出现在顶部中心。谁能告诉我为什么会这样发生以及如何纠正？我在下面包含了代码片段。

<!DOCTYPE html>
<html>
<head>
<script
 src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script
 src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
<link rel="stylesheet"
 href="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css">
</head>
<body>

<p>toast-top-center</p>

<button onclick="myFunction()">Click Here</button>

<p id="demo"></p>

<script>
function myFunction() {
   Command: toastr["error"]
           ("I'm not in the top-center!")

         toastr.options = {
          "closeButton" : false,
          "debug" : false,
          "newestOnTop" : false,
          "progressBar" : false,
          "positionClass" : "toast-top-center",
          "preventDuplicates" : false,
          "onclick" : null,
          "showDuration" : "300",
          "hideDuration" : "1000",
          "timeOut" : "5000",
          "extendedTimeOut" : "1000",
          "showEasing" : "swing",
          "hideEasing" : "linear",
          "showMethod" : "fadeIn",
          "hideMethod" : "fadeOut"
         }
}
</script>

</body>
</html>

最佳答案

我认为错误是因为您在阅读选项之前运行了 toast。

这就是第一个 toast 在右上角的原因。

在你的函数结束时运行 toast，它会工作。

<!DOCTYPE html>
<html>
<head>
<script
 src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script
 src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
<link rel="stylesheet"
 href="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css">
</head>
<body>

<p>toast-top-center</p>

<button onclick="myFunction()">Click Here</button>

<p id="demo"></p>

<script>
function myFunction() {

         toastr.options = {
          "positionClass" : "toast-top-center",
          "closeButton" : false,
          "debug" : false,
          "newestOnTop" : false,
          "progressBar" : false,
          "preventDuplicates" : false,
          "onclick" : null,
          "showDuration" : "300",
          "hideDuration" : "1000",
          "timeOut" : "5000",
          "extendedTimeOut" : "1000",
          "showEasing" : "swing",
          "hideEasing" : "linear",
          "showMethod" : "fadeIn",
          "hideMethod" : "fadeOut"
         }
   Command: toastr["success"]
           ("I'm in the top-center!")

}
</script>

</body>
</html>

关于javascript - Toastr:第一次单击按钮时不会应用 toast-top-center，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38502766/

24

4

0

文章推荐：指向 char 变量的 C++ char 指针

文章推荐： ios - 在 Swift 中创建一个 JSON 对象

android - 如何在不等待当前 toast 完成的情况下立即用第二个 toast 替换当前 toast ？
这个问题在这里已经有了答案: How to prevent Multiple Toast Overlaps (8 个答案) 关闭 6 年前。我有很多按钮。点击它们中的每一个，我都会显示一个 toa
toast - 显示本地 Toast 通知
我想为 Windows Phone 8.1 开发一个包含本地“通知”的通用应用程序。我想要做的是在 toast 控件的扭结中向用户显示所有消息(错误、信息、警告)。一切都在本地完成，无需通过标准通
toast - ionic 造型 2 toast
有没有办法在 ionic 2 toast 中设置文本消息的样式？我试过这个: let toast = Toast.create({ message: "Some text on
java - 在显示新的 Toast 之前取消之前显示的 Toast
我有一个附加到按钮的函数，按下该按钮将从数组列表中删除一个项目，然后显示一个提示“项目已删除!”。如果我多次按下删除按钮，那么所有的 toast 都会显示出来，使其看起来像一个非常长的 toast 显
退出应用程序时和正在显示 toast 时，Android取消 toast
我在这里读到过此类问题，但答案似乎不起作用。当用户点击按钮时，我会显示一个Toast。当用户连续点击按钮时，即使用户退出 Activity ，toast 也会一次又一次地显示。 toast 的长度很
android - 如果没有显示 Toast，则显示 Toast
我有几个可以在 fragment 上单击的按钮。单击每个按钮后，我会显示一条 Toast 消息，每个按钮都完全相同。因此，如果你一个接一个地按下 5 个不同的按钮，你将叠加 5 个 toast 消息，
android - 如果已经显示了一个 Toast，如何避免 Toast
我有几个 SeekBar 和 onSeekBarProgressStop()，我想显示一个 Toast 消息。但是，如果在 SeekBar 上我快速执行操作，那么 UI 线程会以某种方式阻塞并且 T
android - 从其 Toast 对象获取 toast 消息
有没有办法在 android 中获取与特定 android Toast 对象关联的消息？ toast=Toast.makeText(getAppContext(), message, Toast.LE
java - 如何在我的自定义 toast 中也得到 toast 的淡蓝色光晕？
我正在创建我的自定义 toast，主要是因为我将它放在 GridView 上并且需要对其宽度进行一些控制。但我真的很喜欢标准 toast 上的淡蓝色光环，并希望恢复它(或者至少让我的自定义 toast
android - 是否可以禁用 toast 或等到 toast 在测试时消失
我正在使用 Espresso 测试一个应用程序。我有一个问题，是否可以等到当前没有 toast 显示。我的应用程序中有很多不同的 toast，但是在测试时我遇到了问题，因为据我所知，焦点已经转移到 t
android - 为什么 Toast.makeText 而不是新的 Toast
这可能是一个新手问题，但我想知道为什么我们必须使用静态方法 (makeText) 来创建 Toast 而不是构造函数。为什么我们必须使用这个: makeText(Context context, C
android - 如何设置 Toast 显示时间小于 Toast.LENGTH_SHORT
我想显示的 toast 少于 Toast.LENGTH_SHORT，因为我觉得它需要大约 2 秒。我只想显示 toast 半秒。 Toast.LENGTH_SHORT 和 Toast.LENGTH_L
android - toast.getView() 和 toast.setView() 已弃用
我想向用户显示自定义 toast。但 toast.getView() 和 toast.setView() 在 android studio 中已弃用。这是我的代码: Toast toast = To
android-toast - 如何在 WorkManager doWork() 中显示 toast
如何在 WorkManager 中显示 toast do work()？当我尝试时，它会抛出 Caused by: java.lang.RuntimeException: Can't create
android - 为什么我的 Toasts 没有显示？代码正在运行，但没有显示任何 toast
我写了一个代码，它工作正常，但没有任何 toast 出现。 Activity 2: package com.example.kiit.questionme2; import android.conte
java - 在另一个 toast 替换它之前，如何确保 toast 在屏幕上显示特定时间？
我刚刚开始学习 Android。我使用我的 MIUI 10 设备进行调试。我已经学习了非常基础的 App Lifecycle Program。问题是，我正在使用 toasts 来显示何时调用每个方法
android - 持久 Toast 消息 : Toast won't disappear after execution
我有一条消息在执行后不会消失。我猜这与它处于循环中有关，但我不确定。有人可以帮我弄清楚为什么 toast 消息没有区别吗？ @Override public void onClick(View v)
Android toast 振动 (Homer : Mmmm vibrate on toast)
是否可以让手机在您的程序中收到任何 toast 消息时振动？还是必须在每个 toast 上插入振动命令？干杯。最佳答案将此类添加到您的代码中: import android.content.Co
android - Toast 和 onOnclick，toast k 不会显示
有谁知道为什么这个程序不显示 toast 消息？ public class Main extends Activity implements OnClickListener{ /** Called w
android - Toast.LENGTH_LONG 和 Toast.LENGTH_SHORT 的值是多少？
我在我的应用程序中打印 Toast 消息以显示通知，但我想知道Toast.LENGTH_LONG 和 Toast.LENGTH_SHORT。我可以使用哪些其他值。谁能告诉我这两个变量的值是多少？最

首页

博学

6Ren·AI

商城

javascript - Toastr:第一次单击按钮时不会应用 toast-top-center