javascript - 在切换开关更改时显示 toast 消息

Question

我正在研究cordova在 Visual Studio 。我创建了一个示例应用程序，它将显示 json data上chart 。我还放置了一个 toggle button在我的应用程序中。现在我想显示一个toast message将开关从 off 更改为至on和on至off 。现在我正在显示一条警报消息。波纹管是我的html切换代码。

<div class="question" style="font-size:x-large; text-align:center">
        Toggle On/Off
    </div>
    <div class="switch" style="text-align:-webkit-center">
        <input id="cmn-toggle-7" class="cmn-toggle cmn-toggle-yes-no" type="checkbox" checked="checked">
        <label for="cmn-toggle-7" data-on="On" data-off="Off"></label>
    </div>

对于javascript看下面的代码

$("#cmn-toggle-7").on("change", function (event) {
            if ($(this).is(":checked")) {
                alert("Switch is On");
            } else {
                alert("Switch is Off");
            }
        });

关于$(this).is(":checked") or not checked我想在 Toast 上显示与警报中显示的相同消息 20 秒

如有任何帮助，我们将不胜感激

Answer 1

我认为您需要此代码；

<button onclick="myFunction()">Show Snackbar</button>

<div id="snackbar">Some text some message..</div>

<script>
function myFunction() {
    var x = document.getElementById("snackbar")
    x.className = "show";
    setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
}
</script>

有关更多信息，请访问 link