onclick按钮不起任何作用;未调用javascript函数

onclick按钮不起任何作用;未调用javascript函数,javascript,html,authentication,identity,Javascript,Html,Authentication,Identity,我试图用数据库做一个登录页面,但是我的按钮在被点击时不会执行任何操作,即使它会给我带来下一个页面(index2.html)。即使在控制台中也没有显示任何内容,因此我不知道它有什么问题 Javascript代码 var response =""; function plogin(){ var credentials = new Object(); credentials.username= document.getElementById("user").value; creden

我试图用数据库做一个登录页面,但是我的按钮在被点击时不会执行任何操作,即使它会给我带来下一个页面(index2.html)。即使在控制台中也没有显示任何内容,因此我不知道它有什么问题

Javascript代码

var response ="";
  function plogin(){
  var credentials = new Object();

  credentials.username= document.getElementById("user").value;
  credentials.password = document.getElementById("password").value;

  var request = new XMLHttpRequest();

  request.open("POST","/userlogin", true);
  request.setRequestHeader("Content-Type","application/json");
  request.onload=function(){

  response = JSON.parse(request.responseText);
  document.getElementById("loginform").style.display="none";
  if (response.message =="1"){
     window.location = "index2.html?username=" + credentials.username;}
  else{
     document.getElementById("msg").textContent = response.message;}
登录表单

<form id = "loginform" onclick="plogin()"> 
        <label style="color: white;">Username:</label>
        <input type="text" style="border-style: solid; border-width:5px; border-color: slategrey;" placeholder="Jon" id="user" name="username">
        <br>
        <label style="color: white;">Password:</label>
        <input type="password" style="border-style: solid; border-width:5px; border-color: slategrey;" id="password" name="password">
        <br>
        <br>
        <input type="button"  class = "btn btn-secondary" value="Login">
      </form>

尝试在HTML
..
中更改而不是

尝试在HTML
..
中更改而不是

因为您没有提交表单,所以不会触发任何事件。你有一些选择。如果您使用输入类型等于“提交”的提交按钮,您的表单将提交。如果要继续使用“按钮”的输入类型,可以使用“onclick”方法触发函数:

<input type="button" class="btn btn-secondary" value="Submit">
在click事件的事件侦听器中,传递给它的第二个参数称为“回调函数”。您可以在回调函数中实现请求的代码。如果您想使用纯JavaScript,它将如下所示:

var btn = Document.getElementByClassName('btn');
btn.onclick = function() { /*your programming logic*/ };

没有触发任何内容,因为您没有提交表单。你有一些选择。如果您使用输入类型等于“提交”的提交按钮,您的表单将提交。如果要继续使用“按钮”的输入类型,可以使用“onclick”方法触发函数:

<input type="button" class="btn btn-secondary" value="Submit">
在click事件的事件侦听器中,传递给它的第二个参数称为“回调函数”。您可以在回调函数中实现请求的代码。如果您想使用纯JavaScript,它将如下所示:

var btn = Document.getElementByClassName('btn');
btn.onclick = function() { /*your programming logic*/ };

只需将
type=“button”
更改为
type=“submit”
。按钮没有默认行为:首先,表单不能有onClick方法,它应该是submit,或者将输入按钮更改为submit按钮,或者在输入按钮上添加onClick方法。还有一件事你的函数名也是不同的。plogin和userlogin。确保它是要与按钮绑定的函数。@JuhilSomaiya按钮不必是提交按钮。他在当前使用的按钮上触发onClick()事件,然后从JavaScript提交表单。@SimeonIkudabo,你能再看一次我写的内容吗将输入按钮更改为提交按钮或在输入按钮上添加onClick方法`只需将
type=“button”
更改为
type=“submit”
。按钮没有默认行为:首先,表单不能有onClick方法,它应该是submit,或者将输入按钮更改为submit按钮,或者在输入按钮上添加onClick方法。还有一件事你的函数名也是不同的。plogin和userlogin。确保它是要与按钮绑定的函数。@JuhilSomaiya按钮不必是提交按钮。他在当前使用的按钮上触发onClick()事件,然后从JavaScript提交表单。@SimeonIkudabo,你能再看一次我写的内容吗将输入按钮更改为提交按钮,或在输入按钮上添加onClick方法`