JavaScript：發送POST，重定向到響應

Question

我有一個onclick圖像。當click事件觸發時，我想發送一個HTTP POST並讓window.location重定向到對POST的響應。我怎樣才能做到這一點？

Answer 1

假設你需要異步發送POST請求，你可能要檢查下面的例子，讓你在正確的方向前進：

<img src="my_image.png" onClick="postOnClick();"> 

然後你需要的JavaScript函數提交一個異步HTTP POST請求並將瀏覽器重定向到從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框架，如jQuery,Prototype,YUI,ExtJS等。

另外，還需要注意的是，上述內容僅適用於發佈到同一域中託管的腳本，否則您將違反same-origin policy，現代網絡瀏覽器將拒絕發送請求。

Answer 2

使用輸入類型圖像。

<form action="someUrl.html" method="POST"> 
    <input type="image" src="img.png" width="30" height="30" alt="Submit"> 
</form> 

當你將被重定向到的圖像上單擊以「someUrl.html」和職位將被髮送給它

Answer 3

只需綁定的按鈕提交一個表單元素的方法，並且重定向會自然發生。

<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> 

Answer 4

使用jQuery發佈的數據，並重定向到所需的位置，像這樣：

$.ajax({ 
    type: 'POST', 
    url: 'receivedata.asp', 
    data: 'formValue=someValue', 
    success: function(data){ 
     window.location = data; 
    } 
}); 

您可以刪除data: 'formValue=someValue',如果沒有數據傳遞到你想要發佈到網頁。

Answer 5

代替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代碼到您的網頁的當前內容。

Answer 6

您可以使用此功能，我提出：

http://jsfiddle.net/cgarciagl/KU4B6/