Javascript 如何使用jQuery ajax实现post方法
我正在尝试使用jQueryAjax创建一个简单的post方法。每当我点击提交按钮时,我都会收到一个错误:我的控制台中有一个错误的请求。我不确定代码中的错误是什么,如果有人帮助解决这个问题,我会很高兴的。多谢各位 注意:代码中使用的URL是一个伪URL,而不是一个工作URLJavascript 如何使用jQuery ajax实现post方法,javascript,jquery,html,ajax,Javascript,Jquery,Html,Ajax,我正在尝试使用jQueryAjax创建一个简单的post方法。每当我点击提交按钮时,我都会收到一个错误:我的控制台中有一个错误的请求。我不确定代码中的错误是什么,如果有人帮助解决这个问题,我会很高兴的。多谢各位 注意:代码中使用的URL是一个伪URL,而不是一个工作URL <html> <head> <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.
<html>
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css"
media="all" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-formhelpers/2.3.0/css/bootstrap-formhelpers.min.css" rel="stylesheet"
type="text/css" media="all" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-formhelpers/2.3.0/js/bootstrap-formhelpers.min.js"></script>
<script type="text/javascript">
function ok(){
var thisForm = $(this).closest('form.contactPage');
var sendData = thisForm.serialize();
jQuery.ajax({
type: "POST",
// url is dummy and not a working url
url: "dummy URL",
data: thisForm.serialize(),
data: sendData,
success : function(data, textStatus, jqXHR)
{
console.log(data);
},
error: function(jqXHR, textStatus, error){
console.log(error);
}
})
}
</script>
</head>
<body>
<form name="contactPage" class="form-email">
<input type="text" class="form-control input-lg input-sm validate-required" id="name" placeholder="Contact Person" />
<div class="form-group">
<select class="form-control input-lg bfh-countries wrapper-dropdown-2 validate-required" id="dd" data-country="US"></select>
</div>
<input type="text" class="form-control input-lg validate-required" id="contactNum" placeholder="Contact Number" />
<input type="text" class="form-control input-lg validate-required validate-email" id="email" placeholder="Email Address" />
<input type="time" class="form-group form-control input-lg validate-required" id="time" placeholder="Time" />
<input type="submit" class="form-group form-control" value="Contact" onclick="ok()" />
</form>
</body>
</html>
该URL似乎无效
我建议您检查给定的URL 您提供的URL无效。请使用有效的URL重试。您的URL^^出现问题。sendMail不是有效的TLD。另外,您已经指定了两次数据,但这看起来像是您试图调试此数据的一个工件,在松散模式下是无害的,第二个会赢。url是虚拟的。我还没有发布个人信息url@Rudhra:在这种情况下,标准的做法是,如果使用相对URL,则显示相对URL;如果不使用相对URL,则显示一个外观有效的example.com URL。除了我上面提到的复制之外,代码看起来不错。您必须调试从后端获得响应的原因。请检查我提到的代码,url是虚拟的,而不是有效的URL@Rudhra将type:POST更改为type:GET并设置dataType:json。试试这个
<!DOCTYPE html>
<html>
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css"
media="all" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-formhelpers/2.3.0/css/bootstrap-formhelpers.min.css" rel="stylesheet"
type="text/css" media="all" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-formhelpers/2.3.0/js/bootstrap-formhelpers.min.js"></script>
</head>
<body>
<form name="contactPage" id="contactPage" class="form-email">
<input type="text" class="form-control input-lg input-sm validate-required" id="name" placeholder="Contact Person" />
<div class="form-group">
<select class="form-control input-lg bfh-countries wrapper-dropdown-2 validate-required" id="dd" data-country="US"></select>
</div>
<input type="text" class="form-control input-lg validate-required" id="contactNum" placeholder="Contact Number" />
<input type="text" class="form-control input-lg validate-required validate-email" id="email" placeholder="Email Address" />
<input type="time" class="form-group form-control input-lg validate-required" id="time" placeholder="Time" />
<input type="submit" class="form-group form-control" value="Contact"/>
</form>
<script>
$(document).ready(function(){
$(function(){
$("#contactPage").submit(function(event){
event.preventDefault();
$.ajax({
url:'url.php',
type:'POST',
data:$(this).serialize(),
success:function(result){
alert(result);
}
});
});
});
});
</script>
</body>
</html>