2013-09-26 41 views
62

如何用郵政數據重定向?jQuery - 用郵政數據重定向

如何移動到新頁面$_POST

如何做到這一點?它是如何完成的,爲什麼要這樣做

+4

我其實很感興趣,聽到這個答案。 –

+0

使用POST請求設置窗口位置是不可能的,只有GET請求,並且不可能重定向POST請求,所以通常的解決方案是動態創建一個包含所需數據和操作屬性的表單,然後提交它。 – adeneo

+0

你忘記了PHP標籤,還是jQuery有一個'$ _POST'變量? –

回答

66

有一個JQuery插件,可以完成你想做的事情:https://github.com/mgalante/jquery.redirect/blob/master/jquery.redirect.js

包括jQuery和的jquery.redirect.min.js插件,你可以簡單地做這樣的事情後:

$().redirect('demo.php', {'arg1': 'value1', 'arg2': 'value2'}); 

希望這有助於!

+0

謝謝..這個工作對我來說 – Binaryrespawn

+0

@TimS,在檢查出這個鏈接後,我仍然不清楚如何使用post在新的頁面中檢索數據。 – gotguts

+0

不要說,我想通了,並得到它的工作。偉大的建議! – gotguts

7

爲什麼不只是創建一個隱藏的輸入和使用jQuery提交表單?應該工作:)

+0

無法使用拖放文件上傳。出於安全原因,您不能分配文件輸入。 – mlt

+0

我不能想到任何情況,當你可能想重定向用戶的地方,並使他們上傳一個文件與相同的請求。但是,當然 - 這是真的,在這種情況下不起作用。 – kao3991

+0

@mlt我不知道爲什麼它不起作用。您不會將任何內容分配給文件輸入,但您可以使用與表單同時發佈的其他輸入隱藏字段。 – Danosaure

0

爲什麼不只是使用按鈕,而不是提交。點擊該按鈕可讓您構建適合瀏覽器重定向到的正確網址。

$("#button").click(function() { 
    var url = 'site.com/process.php?'; 
    $('form input').each(function() { 
     url += 'key=' + $(this).val() + "&"; 
    }); 
    // handle removal of last &. 

    window.location.replace(url); 
}); 
+2

這隻會導致正常的GET請求,因爲URL正在改變。原來的問題是做POST請求。 –

0

這需要澄清。您的服務器是否處理您想要在其他地方重定向的POST?或者你是否想要將regulatr GET請求重定向到期望POST的另一個頁面?

在這兩種情況下,你可以做的是這樣的:

var f = $('<form>'); 
$('<input>').attr('name', '...').attr('value', '...'); 
//after all fields are added 
f.submit(); 

這可能是一個好主意,做一個鏈接,說「點擊這裏如果沒有自動重定向」,以應對彈出窗口阻止程序。

0

我列入jquery.redirect.min.js head部分插件與此JSON解決方案一起用數據

<script type="text/javascript">  
    $(function() { 
    $('form').on('submit', function(e) { 
     $.ajax({ 
     type: 'post', 
     url: 'your_POST_URL', 
     data: $('form').serialize(), 
     success: function() { 
     // now redirect 
     $().redirect('your_POST_URL', { 
      'input1': $("value1").val(), 
      'input2': $("value2").val(), 
     'input3': $("value3").val() 
     }); 
     } 
    }); 
    e.preventDefault(); 
}); 
}); 
</script> 

提交於是馬上表格後,我加入

$(function(){ 
    $('#your_form_Id').submit(); 
    }); 
+0

注意:輸入應該是輸入的Ids非名字! – kptrick

70

這裏的一個簡單的小函數,可以在任何地方應用,只要你使用jQuery。

var redirect = 'http://www.website.com/page?id=23231'; 
$.redirectPost(redirect, {x: 'example', y: 'abc'}); 

// jquery extend function 
$.extend(
{ 
    redirectPost: function(location, args) 
    { 
     var form = ''; 
     $.each(args, function(key, value) { 
      form += '<input type="hidden" name="'+key+'" value="'+value+'">'; 
     }); 
     $('<form action="'+location+'" method="POST">'+form+'</form>').appendTo('body').submit(); 
    } 
}); 

%的意見,我已經在我的答案擴展:

// jquery extend function 
$.extend(
{ 
    redirectPost: function(location, args) 
    { 
     var form = $('<form></form>'); 
     form.attr("method", "post"); 
     form.attr("action", location); 

     $.each(args, function(key, value) { 
      var field = $('<input></input>'); 

      field.attr("type", "hidden"); 
      field.attr("name", key); 
      field.attr("value", value); 

      form.append(field); 
     }); 
     $(form).appendTo('body').submit(); 
    } 
}); 
+3

這是一個很容易實現的功能... – CrandellWS

+9

爲移動設備添加'.appendTo('body')'例如: '$('

'+ form +'
').appendTo('body')。submit();'基於此答案的思路(http://stackoverflow.com/a/18870799) – CrandellWS

+4

這個解決方案很多比接受的回答更好。這很容易實現,不需要加載額外的庫! –

0

構建並填寫一個隱藏的方法= POST ACTION = 「http://example.com/vote」 表單並提交它,而不是使用window.location。

$('#inset_form').html(
    '<form action="url" name="form" method="post" style="display:none;"> 
    <input type="text" name="name" value="' + value + '" /></form>'); 
document.forms['form'].submit(); 
2

文件/窗口準備添加之前 「擴展」 到jQuery的:

$.extend(
{ 
    redirectPost: function(location, args) 
    { 
     var form = ''; 
     $.each(args, function(key, value) { 

      form += '<input type="hidden" name="'+value.name+'" value="'+value.value+'">'; 
      form += '<input type="hidden" name="'+key+'" value="'+value.value+'">'; 
     }); 
     $('<form action="'+location+'" method="POST">'+form+'</form>').submit(); 
    } 
}); 

用途:

$.redirectPost("someurl.com", $("#SomeForm").serializeArray()); 

注:此方法斜面後的文件。

0

我認爲這是做到這一點的最好方法!

<html> 
<body onload="document.getElementById('redirectForm').submit()"> 
<form id='redirectForm' method='POST' action='/done.html'> 
<input type='hidden' name='status' value='complete'/> 
<input type='hidden' name='id' value='0u812'/> 
<input type='submit' value='Please Click Here To Continue'/> 
</form> 
</body> 
</html> 

這幾乎是瞬間的,用戶不會看到任何東西!

0

與上述答案類似,但寫法不同。

$.extend(
{ 
    redirectPost: function (location, args) { 
     var form = $('<form>', { action: location, method: 'post' }); 
     $.each(args, 
      function (key, value) { 
       $(form).append(
        $('<input>', { type: 'hidden', name: key, value: value }) 
       ); 
      }); 
     $(form).appendTo('body').submit(); 
    } 
});