前言:
最近在开发一个公司内部项目,因为是内部自己使用,而且需求方要求内存不能太大,所以就不考虑使用Vue或React。思前想后决定使用jq来开发。一来可以满足项目要求,二来还可以练练手,毕竟用久框架回把之前原生的都忘记了。
目的:
主要还是为了记录一下开发过程中遇到的一些bug,加深一下印象,也可以为以后遇到相同bug能快速找到解决方法。
Bug:使用post请求页面报405
报错如下:
碎碎念:一开始碰到这个错误的时候就以为是接口错误(其实不是接口问题,原因后面说),于是就在网上拼命找解决方法。类似与很多php原因啊、contentType啊、浏览器设置啊等等,我都试了一遍,折腾了几个小时还是不行。差点就把责任推给后端了(日常甩锅),感觉是不是这个后端不行啊,写个接口还这么多报错。这时才发现报错的不是接口,是这个html文件…天啊!这几年开发眼睛都花了!!
原因: 仔细一看,原来是 form 表单引起的问题。上 报错代码
<div class="wrapper wrapper-content">
<hr style="border: 1px solid #30519c;">
<h4>安全</h4>
<form id="mainForm" method="POST" class="form-horizontal">
<div style="width:100%;line-height:1.5em;text-align: center;font-size:14px">
******
</div>
</form>
<hr style="border: 1px solid #30519c;">
</div>
<script>
$("button").click(function () {
var user = $('#user').val()
var oldPwd = $('#oldPwd').val()
var newPwd = $('#newPwd').val()
var newPwdVerify = $('#newPwdVerify').val()
var params = { user, oldPwd, newPwd, newPwdVerify }
$.ajax({
url: 'http://1**.0.0.1:***/system/******',
type: 'POST',
data: params,
success: function () {
// console.log(data)
},
});
});
</script>
解决: 把 form 标签去掉就可以了。具体为什么form表单不行目前还未找到原因,需后续继续研究。
Bug 总结:
归根到底还是对jq用的不够熟,还得多加练习。当然页面报405不一定是form表单引起的问题,也有可能是其它原因引起的,如果这种解决方法无法帮你解决问题,那同志仍需努力,不要放弃,加油!!!