表单ajax提交不跳转，清空input框值以及php跨域请求数据总结

进行表单ajax时提交时，避免使用form标签，否则页面会跳转，ajax请求会延迟，页面跳转将导致ajax成功后返回的结果也刷掉，so应去掉form标签。代码如下，使用button提交

本地场次编号：<input type="text" class="textBox" id="localId" name="localId"/>
线上场次编号：<input type="text" class="textBox" id="onlineId" name="onlineId"/>
<p class="font">温馨提示：请系统比赛结束后，再点提交！</p>
<p class="mt80">
    <button class="btn" id="sub">提交</button>
</p>

点击按钮，触发jquery规则，ajax提交

$('#sub').click(function(){
    var localId = document.getElementById("localId");
    var onlineId = document.getElementById("onlineId");
    if(localId.value == ""){
        alert("请输入本地场次编号");
        document.getElementById("localId").focus();
        return false;
    }
    if(onlineId.value == ""){
        alert("请输入线上场次编号");
        document.getElementById("onlineId").focus();
        return false;
    }
    $.post("/access/access.php", 
    { localId: $("#localId").val(),
      onlineId: $("#onlineId").val()
     },function(data){
                    alert(data);
                    $('#localId').val('').focus();
                    if(data=='操作成功')
                    $('#onlineId').val('');                                    
        });
    });

清空input值jquery代码

$('#onlineId').val('');

浏览器跨域请求php接口，无法获取到数据，可以在服务端加上代码解决

 header("Access-Control-Allow-Origin: *");
 header('Access-Control-Allow-Methods: "OPTIONS, GET, POST"');
 header('Access-Control-Allow-Credentials: true');
 header('Access-Control-Allow-Headers: "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"');
 header('Access-Control-Max-Age: "3600"');