$.ajax不发送请求,没有网络请求
同一个网页下
<form class="form" id="a-form">
<h2 class="form_title title">创建账号</h2>
<div class="form_icons">
<i class="iconfont icon-QQ"></i>
<i class="iconfont icon-weixin"></i>
</div>
<span class="form_span">选择注册方式激活电子邮箱注册</span>
<input type="text" class="form_input" placeholder="用户名" id="name1" name="name1" required>
<input type="email" class="form_input" placeholder="电子邮箱" id="email1" name="email1" required>
<button class="captcha" id="sendBtn">发送验证码</button>
<input type="text" class="form_input" placeholder="邮箱验证码" id="code1" name="code1" required>
<input type="password" class="form_input" placeholder="密码" id="password1" name="password1" required>
<button class="form_button button submit">注册</button>
</form>
<form class="form" id="b-form">
<h2 class="form_title title">登入账号</h2>
<div class="form_icons">
<i class="iconfont icon-QQ"></i>
<i class="iconfont icon-weixin"></i>
</div>
<span class="form_span">选择登录方式激活电子邮箱登录</span>
<input type="email" class="form_input" placeholder="电子邮箱" id="email2" name="email2" required>
<input type="password" class="form_input" placeholder="密码" id="password2" name="password2" required>
<a class="form_link">忘记密码?</a>
<button class="form_button button submit">登录</button>
</form>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script>
$(document).ready(function() {
// 发送验证码
$("#sendBtn").click(function() {
var email = $("#email1").val();
$.ajax({
url: "http://8.130.26.106:8080/users/code",
type: "GET",
data: {
username: email
},
success: function(response) {
alert("验证码已发送,请在邮箱查收!");
},
error: function(error) {
alert("发送验证码失败!");
}
});
});
$("#a-form").submit(function(event) {
event.preventDefault();
var username = $("#name1").val();
var email = $("#email1").val();
var code = $("#code1").val();
var password = $("#password1").val();
console.log(code);
$.ajax({
url: "http://8.130.26.106:8080/register",
type: "POST",
async: false,
data: JSON.stringify({
"code": code,
"password": password,
"username": email
}),
success: function(response) {
console.log(response);
alert("表单提交成功!");
},
error: function(error) {
console.log(error);
alert("表单提交失败!");
}
});
});
$("#b-form").submit(function(event) {
event.preventDefault();
var email = $("#email2").val();
var password = $("#password2").val();
console.log(password);
$.ajax({
url: "http://8.130.26.106:8080/login",
type: "POST",
async: false,
data: {
"username": email,
"password": password
},
success: function(response) {
console.log(response);
alert("表单提交成功!");
},
error: function(error) {
console.log(error);
alert("表单提交失败!");
}
});
});
});
</script>
发送验证码的请求是正常的,后面的注册和登录两个请求连网络请求都没有,接口也用postman试过了,都可以


相关推荐
JQuery中$.ajax()方法参数详解及应用
JQuery中$.ajax()方法想必大家并不陌生吧,在本文将为大家介绍下其参数及应用示例,感兴趣的朋友不要错过
为jquery的ajax请求添加超时timeout时间的操作方法
主要介绍了为jquery的ajax请求添加超时timeout时间的操作方法,文中通过一段简单的代码给大家介绍jquery ajax超时设置方法,感兴趣的朋友跟随脚本之家小编一起看看吧
jQuery中$.ajax()方法参数解析
主要为大家详细解析了jQuery中$.ajax()方法参数,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
JS Ajax请求如何防止重复提交
好长时间没写js代码了刚好遇到这样的问题。我们系统多数表单没有做防止重复提交的。 由于不想在后端这边处理,因为假如由后端处理的话,就需要在页面加载的时候给出一次性的token值,加大了开发的工作量不说,还容易忘记做这个,同时,ajax也不好处理,需要提交失败的话同时返回新的token值。 所以我想在,js这边动手。其实以前和前端提过,久久不见动静,就只好弄块砖丢出去了。思路是,覆盖掉$.ajax,在这里面处理掉防止重复提交的问题,而前端的业务开发不受影响,不改代码,无感知。 我想架构的目的之一,就在于简化业务开发,屏蔽掉业务无关的细节,让一线开发安心写业务吧。 代码如下: /** * Cre
解决ajax请求后台,有时收不到返回值的问题
今天小编就为大家分享一篇解决ajax请求后台,有时收不到返回值的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧



