重复调用Javascript函数

时间:2018-06-24 03:11:59

标签: javascript php html post

我最近在重复调用javascript函数时遇到问题。我有一个可以调用javascript方法的按钮。在该方法中,网页将被发送并获得对php脚本的POST http请求。但是该网页每秒钟发送一次相同的请求。

这是脚本:

function processLogin() {
  //console.log("requested")
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      //console.log("Hey");
      //document.body.innerHTML+= html;
      console.log("encountered");
      //xhttp.abort();
    }
  };
  xhttp.open("POST", "csc.php", true);
  xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xhttp.send("uid=" + document.getElementById("username").value + "&pass=" + document.getElementById("password").value);
  event.stopPropagation? event.stopPropagation() : event.cancelBubble = true;
  return false;
}

HTML:

<div class="container" style="height:100vh!important;">

<div id="lginMain" class="jumbotron add" style="width : 50vh!important;margin:0 auto!important; float:middle!important;position:relative!important;top:25%!important;">

    <div class="form-group">
        <h1 style="font-size:30px;">Welcome back</h1>
        <br>
        <label for="email">Username:</label>
        <input type="text" class="form-control" name="username" id="username">
    </div>
    <div class="form-group">
        <label for="pwd">Password:</label>
        <input type="password" class="form-control" name="password" id="password">
    </div>

    <button class="btn btn-primary" onClick="processLogin()">Submit</button>
</div>

这是网络进程的屏幕截图:

You can see multiple calls, when the button is just pressed once

任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

好的,这是我的问题,Jaromanda X表示附加事件侦听器可以解决问题。因此,删除“ onlick”属性并添加事件侦听器可以解决此问题。