我是一个Javascript新手，我正试图获得一个测试电子邮件和密码的检查器，但我需要在我的代码中放入setTimeout：
该代码负责访问api并发出相同的请求，从而使定义的代码本身正确工作，更准确地放置这个范围。我看到了一些示例，但它们使用settimeout
以下是我所做的：
<!DOCTYPE html>
<!--get out, you will not copy my html-->
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title></title>
<link rel="shortcut icon" href="">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="http://webapplayers.com/luna_admin-v1.1/vendor/animate.css/animate.css"/>
<link rel="stylesheet" href="http://webapplayers.com/luna_admin-v1.1/vendor/bootstrap/css/bootstrap.css"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
<link rel="stylesheet" href="http://webapplayers.com/luna_admin-v1.1/styles/pe-icons/pe-icon-7-stroke.css"/>
<link rel="stylesheet" href="http://webapplayers.com/luna_admin-v1.1/styles/pe-icons/helper.css"/>
<link rel="stylesheet" href="http://webapplayers.com/luna_admin-v1.1/styles/stroke-icons/style.css"/>
<link rel="stylesheet" href="http://webapplayers.com/luna_admin-v1.1/styles/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
</head>
<!--my own css-->
<style>
body{
overflow-x: hidden;
}
#top-bar{
background-color: #3E3D3D;
width: 100%;
height: 60px;
background-color: #;
position: relative;
top: -20px;
}
#title-top-bar{
position: relative;
top: 5px;
color: white;
font-weight: bold;
font-family: 'Quicksand', sans-serif;
left: 55px;
}
#logo-top-bar{
width: 60px;
position: relative;
top: -50px;
}
#shop-redirect-mold{
width: 100px;
height: 100px;
background-color: #202a38;
border-radius: 100%;
position: relative;
top: -100px;
}
#shop-redirect-mold2{
width: 90px;
height: 90px;
background-color: #d6d6d6;
border-radius: 100%;
position: relative;
top: -195px;
}
#db-list-box{
background-color: #212a36;
width: 70%;
height: 350px;
border-radius: 5px;
position: relative;
top: -20px;
}
#lista{
background-color:#2e;
width: 100%;
height: 200px;
resize: none;
position: relative;
top: 0px;
font-weight: bold;
font-family: 'Quicksand', sans-serif;
font-size: 15px;
color: #686868;
text-align: center;
overflow-x: hidden;
border-color: white;
border-left: none;
border-right: none;
}
#botao{
background-color:#2e;
width: 100%;
height: 200px;
resize: none;
position: relative;
top: 0px;
font-weight: bold;
font-family: 'Quicksand', sans-serif;
font-size: 15px;
color: #686868;
text-align: center;
overflow-x: hidden;
border-color: white;
border-left: none;
border-right: none;
}
#db-list-title{
position: relative;
top: 5px;
color: white;
font-size: 30px;
font-weight: bold;
font-family: 'Quicksand', sans-serif;
}
#db-list-result-cont{
color: white;
font-family: 'Quicksand', sans-serif;
}
#result-box{
position: relative;
left: 205px;
top: -10px;
background-color: #212a36;
width: 800px;
height: 250px;
border-radius: 5px;
color: white;
font-weight: bold;
font-family: 'Quicksand', sans-serif;
}
#lives{
width: 100%;
background-color: #1a222e;
height: 200px;
resize: none;
position: relative;
top: 0px;
font-weight: bold;
font-family: 'Quicksand', sans-serif;
font-size: 15px;
color: #28a745;
text-align: center;
overflow-x: hidden;
border-color: white;
border-left: none;
border-right: none;
}
#dies{
width: 100%;
background-color: #1a222e;
height: 200px;
resize: none;
position: relative;
top: 0px;
font-weight: bold;
font-family: 'Quicksand', sans-serif;
font-size: 15px;
color: #dc3545;
text-align: center;
overflow-x: hidden;
border-color: white;
border-left: none;
border-right: none;
}
#socks{
width: 100%;
background-color: #1a222e;
height: 200px;
resize: none;
position: relative;
top: 0px;
font-weight: bold;
font-family: 'Quicksand', sans-serif;
font-size: 15px;
color: #ffc107;
text-align: center;
overflow-x: hidden;
border-color: white;
border-left: none;
border-right: none;
}
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: #1a222e;
}
::-webkit-scrollbar-thumb {
background: #888;
}
::-webkit-scrollbar-thumb:hover {
background: #555;
}
</style>
<!--website content-->
<body class="animated bounce">
<!--top bar and navegation-->
<!--first text box-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/darkly/bootstrap.min.css" rel="stylesheet" integrity="sha384-S7YMK1xjUjSpEnF4P8hPUcgjXYLZKK3fQW1j5ObLSl787II9p8RO9XUGehRmKsxd" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet">
</head>
<body>
<center> <br>
<h1 style="font-family: 'Poiret One', cursive; font-size: 30px;"></h1>
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript"></script>
<center>
<textarea id="list" name="lista" rows="5" required="" cols="1" style="overflow:auto; width:50%; height:50%; text-align: center;" cols="1" placeholder="" maxlength="670"></textarea>
<textarea name="socks" id="socks" rows="9" class="form-control" style="width:1%;text-align:left;resize:none;margin-left:-10140px;margin-top:-193px;" placeholder=""></textarea>
<span style="outline: none; overflow:auto; color: #FFF; resize:none; color: white; text-align: center;">Status: </span> <span class="badge badge-custom" id="status">Aguardando...</span>
<br> <span style="outline: none; overflow:auto; color: #FFF; resize:none; color: white; text-align: center;">Carregadas: </span> <span class="badge badge-secondary" id="total">0</span>
<span style="outline: none; overflow:auto; color: #FFF; resize:none; color: white; text-align: center;">Aprovados: </span> <span class="badge badge-success" id="live">0</span>
<span style="outline: none; overflow:auto; color: #FFF; resize:none; color: white; text-align: center;">Reprovadas: </span> <span class="badge badge-danger" id="die">0</span>
<span style="outline: none; overflow:auto; color: #FFF; resize:none; color: white; text-align: center;">Testadas: </span> <span class="badge badge-warning" id="testadas">0</span>
</div>
</div>
<br>
<br>
</center>
<div class="button-list">
<button class="btn btn-success" type="submit" id="start">INICIAR</i></button>
<button class="btn btn-danger" type="submit" id="stop">PARAR</button>
<button class="btn btn-warning" type="submit" id="clear">LIMPAR</button>
</div>
<script>
var audio = new Audio('blop.mp3');
$(document).ready(function () {
$('#status').html('<span id="bad" class="badge badge-danger">Não iniciado !</span>');
$('#start').attr('disabled', null);
$('#clear').attr('disabled','disabled');
$('#stop').attr('disabled','disabled');
$('#start').click(function () {
audio.play();
var line = $('#list').val().split('n');
var total = line.length;
var ap = 0;
var rp = 0;
var sd = 0;
$('#total').html(total);
line.forEach(function (value) {
var ajaxCall = $.ajax({
url: 'api.php',
type: 'GET',
data: 'lista=' + value,
beforeSend: function () {
$('#status').html('<span class="badge badge-success">Testando !</span>');
$('#stop').attr('disabled',null);
$('#stop').attr('disabled',null);
$('#start').click(function () {
audio.play();
var line = $('#list').val().split('n');
var total = line.length;
var ap = 0;
var rp = 0;
var sd = 0;
$('#total').html(total);
lines.forEach((value, i) => {
setTimeout(function() {
$.ajax({
url: 'api.php',
type: 'GET',
data: 'lista=' + value,
beforeSend: function () {
console.log("Before send: " + value);
$('#status').html('<span class="badge badge-success">Testando !</span>');
$('#stop').attr('disabled',null);
$('#stop').attr('disabled',null);
$('#start').attr('disabled','disabled');
},
success: function(data){
if(data.indexOf("Aprovada") >= 0){
$("#aprovadas").val(data + "n" + $("#aprovadas").val());
ap = ap + 1;
document.getElementById("aprovadas").innerHTML += data + "<br>";
audio.play();
removelinha();
}else{
$("#reprovadas").val(data + "n" + $("#reprovadas").val());
rp = rp + 1;
document.getElementById("reprovadas").innerHTML += data + "<br>";
removelinha();
}
var fila = parseInt(ap) + parseInt(rp);
$('#live').html(ap);
$('#die').html(rp);
$('#testadas').html(fila);
if (fila == total) {
$('#start').attr('disabled', null);
$('#stop').attr('disabled', 'disabled');
$('#clear').attr('disabled',null);
$('#status').html('<span class="badge badge-info">Teste Finalizado !</span>');
audio.play();
}
}
});
}, 2000);
});
});
</script>
</div>
</center>
<center><br>
<div class="container">
<div class="panel panel-content">
<div style="text-align: center;" class="panel-heading"><i class="fas fa-check-circle"></i><strong> APROVADAS </strong><i class="fas fa-check-circle"></i></div>
<div style="font-size: 15px;" class="aprovados">
<div id="aprovadas" class="card-body"></div>
</div>
</div>
<div class="panel panel-content">
<div style="text-align: center;" class="panel-heading"><i class="fas fa-times-circle"></i> REPROVADA <i class="fas fa-times-circle"></i></div>
<div style="font-size: 15px;" class="reprovadas">
<div id="reprovadas" class="card-body"></div>
</div>
</div>
</center>
我想在每次请求之间设置一个延迟！
尝试将其替换为以前的$('#start').click():
<script>
var audio = new Audio('blop.mp3');
$(document).ready(function () {
$('#status').html('<span id="bad" class="badge badge-danger">Não iniciado !</span>');
$('#start').attr('disabled', null);
$('#clear').attr('disabled','disabled');
$('#stop').attr('disabled','disabled');
$('#start').click(function () {
audio.play();
var line = $('#list').val().split('n');
var total = line.length;
var ap = 0;
var rp = 0;
var sd = 0;
$('#total').html(total);
lines.forEach((value, i) => {
setTimeout(function() {
$.ajax({
url: 'api.php',
type: 'GET',
data: 'lista=' + value,
beforeSend: function () {
$('#status').html('<span class="badge badge-success">Testando !/span>');
$('#stop').attr('disabled',null);
$('#stop').attr('disabled',null);
$('#start').attr('disabled','disabled');
},
success: function(data){
if(data.indexOf("Aprovada") >= 0){
$("#aprovadas").val(data + "n" + $("#aprovadas").val());
ap = ap + 1;
document.getElementById("aprovadas").innerHTML += data + "<br>";
audio.play();
removelinha();
}else{
$("#reprovadas").val(data + "n" +
$("#reprovadas").val());
rp = rp + 1;
document.getElementById("reprovadas").innerHTML += data + "<br>";
removelinha();
}
var fila = parseInt(ap) + parseInt(rp);
$('#live').html(ap);
$('#die').html(rp);
$('#testadas').html(fila);
if (fila == total) {
$('#start').attr('disabled', null);
$('#stop').attr('disabled', 'disabled');
$('#clear').attr('disabled',null);
$('#status').html('<span class="badge badge-info">Teste Finalizado !</span>');
audio.play();
}
}
});
}, 2000);
});
});
$('#stop').click(function(){
$('#status').html('<span class="badge badge-danger">Parado !</span>');
});
$('#clear').click(function(){
$('#status').html('<span class="badge badge-secondary">Lista Limpa!</span>');
$('#list').val('');
});
});
});
function removelinha() {
var lines = $("#list").val().split('n');
lines.splice(50, 50);
$("#list").val(lines.join("n"));
}
</script>
请注意，这并不能保证在2秒内处理这些请求的响应。这只会使请求在两秒钟之间发送。
还要注意，在该代码中，第一个请求也只会在2秒钟后发出。如果你想要不同的方式，请告诉我。
您想将settimeout用于哪个位置示例：
var audio = new Audio('blop.mp3');
$(document).ready(function () {
$('#status').html('<span id="bad" class="badge badge-danger">Não iniciado !</span>');
$('#start').attr('disabled', null);
$('#clear').attr('disabled','disabled');
$('#stop').attr('disabled','disabled');
$('#start').click(function () {
audio.play();
var line = $('#list').val().split('n');
var total = line.length;
var ap = 0;
var rp = 0;
var sd = 0;
$('#total').html(total);
line.forEach(function (value) {
var ajaxCall = $.ajax({
url: 'api.php',
type: 'GET',
data: 'lista=' + value,
beforeSend: function () {
$('#status').html('<span class="badge badge-success">Testando !</span>');
$('#stop').attr('disabled',null);
$('#stop').attr('disabled',null);
$('#start').attr('disabled','disabled');
},
success: function(data){
setTimeout(() => {
if(data.indexOf("Aprovada") >= 0){
$("#aprovadas").val(data + "n" + $("#aprovadas").val());
ap = ap + 1;
document.getElementById("aprovadas").innerHTML += data + "<br>";
audio.play();
removelinha();
}else{
$("#reprovadas").val(data + "n" + $("#reprovadas").val());
rp = rp + 1;
document.getElementById("reprovadas").innerHTML += data + "<br>";
removelinha();
}
var fila = parseInt(ap) + parseInt(rp);
$('#live').html(ap);
$('#die').html(rp);
$('#testadas').html(fila);
if (fila == total) {
$('#start').attr('disabled', null);
$('#stop').attr('disabled', 'disabled');
$('#clear').attr('disabled',null);
$('#status').html('<span class="badge badge-info">Teste Finalizado !</span>');
audio.play();
}
},2000)
}
});
$('#stop').click(function(){
ajaxCall.abort();
$('#start').attr('disabled',null);
$('#stop').attr('disabled','disabled');
$('#clear').attr('disabled',null);
});
});
$('#stop').click(function(){
$('#status').html('<span class="badge badge-danger">Parado !</span>');
});
$('#clear').click(function(){
$('#status').html('<span class="badge badge-secondary">Lista Limpa!</span>');
$('#list').val('');
});
});
});
function removelinha() {
var lines = $("#list").val().split('n');
lines.splice(50, 50);
$("#list").val(lines.join("n"));
}