我尝试创建Logout按钮,但我不知道该使用什么。
如何在几秒钟内将注销文本更改为“等待...”,然后切换到“成功”?
我仍然需要学习jquery。
function logout() {
$("#logout").text("Waiting...", 3000);
$("#logout").text("Success!", 1000);
closeWindow();
}
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('logout').addEventListener('click', logout);
});
HTML:
<button type="button" class="list-group-item" id="logout"> Log out</button>
你能帮助我提供参考资料吗?
我从这篇文章中了解到:W3Schools.com
答案 0 :(得分:1)
这可能有助于尝试这一点:
gulp.task('_default', function (solutionConfig) {
if (solutionConfig == "Release") {
// perform desired task here
}
else if (solutionConfig == "Debug" {
// perform desired task here
}
});
function logout(){
$("button").text("waiting...");
setInterval(sucess,3000)
}
function sucess(){
$("button").css("background","green");
$("button").text("successfull");
clearInterval();
}
$("button").click(logout);
button{
background:orange;
border:none;
color:white;
padding:20px 20px;
font-size:20px;
}
答案 1 :(得分:0)
document.addEventListener('DOMContentLoaded' ....
不需要&amp; 3秒后,在click
按钮更新时显示Success
消息。使用setTimeout
来引入延迟
function logout() {
$("#logout").text("Waiting...", 3000);
setTimeout(function() {
$("#logout").text("Success!", 1000);
}, 3000)
}
document.getElementById('logout').addEventListener('click', logout);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" class="list-group-item" id="logout"> Log out</button>
答案 2 :(得分:0)
使用setTimeout延迟执行某些代码,例如
function logout() {
$("#logout").text("Waiting...");
/* using setTimeout delays execution of a code in JavaScript */
setTimeout(function () {
/* this code will execute after 3000 miliseconds or 3 seconds */
$("#logout").text("Success!");
// closeWindow();
}, 3000);
}
$('#logout').on('click', logout);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" class="list-group-item" id="logout"> Log out</button>
答案 3 :(得分:0)
我猜使用 setTimeout 会帮助你延迟并在按钮中显示文字
<强> HTML 强>
<button type="button" class="list-group-item" id="logout"> Log out</button>
<强> JS 强>
$('#logout').click(function() {
$(this).html('Waiting');
setTimeout(function() {
$('#logout').html('Success');
}, 3000);
});
答案 4 :(得分:0)
您必须使用 setTimeout 功能。
请查看代码
$(document).ready(function(){
//Click Event
$("#logout").click(function(){
//Waiting will be here after 1 second
setTimeout(function(){
$("#logout").text("Waiting...")
},1000)
//Waiting will be here after 3 second
setTimeout(function(){
$("#logout").text("Success")
},3000)
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" class="list-group-item" id="logout"> Log out</button>
每当按钮点击事件将被触发,然后是回调函数。在该函数内部,我编写了以下代码。
setTimeout(function(){
$("#logout").text("Waiting...")
},1000)
setTimeout函数接受一个调用函数和一个时间参数(以毫秒为单位)我提供1000毫秒后1000毫秒的文本将等待
就像我再次为成功而写的一样。
setTimeout(function(){
$("#logout").text("Success")
},3000)