H5+app -- 关于ajax提交问题

Posted 2021-01-21 弹琴不谈情

H5 app ajax

　　1、前阵子在做系统的h5+ app为满足手机端也能进行业务操作，例如：提货，扫描入库之类的。所以就要将做接口，从手机端调用后台系统的方法。

　　2、例如这样的请求格式，但是呢，每次请求它都直接跳到error，刚开始还以为是网络问题，就连上wifi试了试，发现还是直接跳error。然后就开始怀疑请求格式了。。。

　如下：

       function openScan(data) {
　　　　　　　mui.ajax(OPENSCAN, {
                        data: data,
                        dataType: \'json\',
                        type: \'post\',
                        timeout: 10000,
                        headers: {
                            \'Content-Type\': \'application/json\',
                            \'accessToken\': localStorage.getItem(\'accessToken\')
                        },
                        success: function(result) {
                            JQ("#prompt1").html("");
　　　　　　　　　　　　　　},
　　　　　　　　　　　　　　error: function(xhr, type, errorThrown) {
　　　　　　　　　　　　　　　　app.ajaxError(xhr, type, errorThrown);
　　　　　　　　　　　　　　}
　　　　　　　　　　　});    
    ｝

　　3、其实是正确的格式。。。最后突然想起来，tm。。。原来只有一个文本框，这时候已经是1个多小时后了。

　　4、所以一个文本框时会出现bug，历史由来已久，想了解问度娘。

　　5、所以顺便说说一个文本框bug解决的方法。

　　　　a.最简单就是直接多加一个文本框，然后进行隐藏。

　　　　如下:　

<form class="mui-input-group">
	<div class="mui-input-row">
	　　<label style="font-size: 90%;">扫描条码：</label>
	　　<input type="text" class="mui-input-clear" placeholder="请输入条码" id="trackingNo" value="" style="color: blue">
	</div>
	　　<div class="mui-input-row" style=" display: none;">  //格式随意，只要不是一个文本框，就没有问题了
	　　<input type="text" class="mui-input-clear" placeholder="隐藏" id="trackingNo1" value="">
	</div>
</form>

　　　　b. 使用preventDefault()方法，preventDefault() 方法阻止元素发生默认的行为（例如，当点击提交按钮时阻止对表单的提交）。

　　　　如下：

doc.querySelector(\'#trackingNo\').addEventListener(\'keydown\', function(e) {
　　e.preventDefault();
　　if(e.keyIdentifier == "Enter") {
　　　　　var trackingNo = JQ(\'#trackingNo\').val();
　　　　　if(trackingNo == null || trackingNo == \'\') {
	　　alert("扫描条码不能为空！");
	　　return;
	}
　　　　 openScan(trackingNo);
   }
});

　　后记：转发请注明出处：https://www.cnblogs.com/lrj1009IRET/p/9998142.html