我有一张带有onclick的图像。当click事件触发时,我想发送一个HTTP POST并让window.location重定向到POST的响应。我怎么能这样做?
答案 0 :(得分:16)
只需将按钮绑定到表单元素的submit方法,重定向就会自然发生。
<script type='text/javascript'>
function form_send(){
f=document.getElementById('the_form');
if(f){
f.submit();
}
}
</script>
<form method='post' action='your_post_url.html' id='the_form'>
<input type='hidden' value='whatever'>
</form>
<span id='subm' onclick='form_send()'>Submit</span>
答案 1 :(得分:13)
假设您需要异步发送POST请求,您可能需要查看下面的示例,以确保您朝着正确的方向前进:
<img src="my_image.png" onClick="postOnClick();">
然后,您需要一个提交异步HTTP POST请求的JavaScript函数,并将浏览器重定向到从HTTP响应接收的URL。您应该可以使用XMLHttpRequest
进行此类异步调用,如下例所示:
function postOnClick()
{
var http = new XMLHttpRequest();
var params = "arg1=value1&arg2=value2";
http.open("POST", "post_data.php", true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.setRequestHeader("Content-length", params.length);
http.setRequestHeader("Connection", "close");
http.onreadystatechange = function() {
if (http.readyState == 4 && http.status == 200) {
window.location = http.responseText;
}
}
http.send(params);
}
请注意,对于真正的跨浏览器XMLHttpRequest
调用,您可能希望使用符合标准的跨浏览器XMLHttpRequest实现,如XMLHttpRequest.js,除非您使用某些JavaScript框架,如{{3 }},jQuery,Prototype,YUI,等等。
此外,还要注意上述内容仅在您发布到同一域中托管的脚本时才有效,否则您将违反ExtJS,现代Web浏览器将拒绝发送请求。< / p>
答案 2 :(得分:3)
而不是window.location = http.responseText
使用以下内容:
http.onreadystatechange = function() {
if (http.readyState == 4 && http.status == 200) {
document.open();
document.write(http.responseText);
}
}
document.open()
清除页面的当前内容,document.write()
将响应html代码插入到您的页面中。
答案 3 :(得分:2)
使用jQuery发布数据并重定向到您想要的位置,如下所示:
$.ajax({
type: 'POST',
url: 'receivedata.asp',
data: 'formValue=someValue',
success: function(data){
window.location = data;
}
});
如果没有数据要传递到您要发布到的页面,则可以删除data: 'formValue=someValue',
。
答案 4 :(得分:2)
你可以使用我做的这个功能:
答案 5 :(得分:1)
使用输入类型图像。
<form action="someUrl.html" method="POST">
<input type="image" src="img.png" width="30" height="30" alt="Submit">
</form>
点击图片后,您将被重定向到“someUrl.html”,并会向其发送帖子