source

jQuery - 포스트 데이터로 리디렉션

factcode 2023. 10. 26. 21:53
반응형

jQuery - 포스트 데이터로 리디렉션

포스트 데이터로 리디렉션하려면 어떻게 해야 합니까?

새 페이지로 이동하는 방법$_POST?

이거 어떻게 해요?그것은 어떻게 행해지고 왜 행해지나요?

여기 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();
    }
});

JQuery 플러그인을 사용하면 https://github.com/mgalante/jquery.redirect/blob/master/jquery.redirect.js 과 같은 작업을 수행할 수 있습니다.

JQuery와 jquery.redirect.min.js 플러그인을 포함한 후에는 다음과 같은 작업을 간단히 수행할 수 있습니다.

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

새로운 JQuery 버전에서는 대신 다음 코드를 사용합니다.

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

그냥 숨은 입력이 있는 양식을 만들어서 jQuery를 이용해서 제출하는 것은 어떨까요?작동해야 합니다 :)

이렇게 하면 게시된 데이터로 리디렉션됩니다.

$(function() {
       $('<form action="url.php" method="post"><input type="hidden" name="name" value="value1"></input></form>').appendTo('body').submit().remove();
    });

    }

.submit() 함수는 자동으로 URL로 제출합니다.
.remove () 함수는 제출 후 폼을 죽입니다.

문서/창이 준비되기 전에 jQuery에 "extend"를 추가합니다.

$.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());

참고: 이 메서드는 파일을 게시할 수 없습니다.

나는 이것이 가장 좋은 방법이라고 생각해요!

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

이것은 거의 즉각적이고 사용자는 아무것도 볼 수 없을 것입니다.

이것은 해명이 필요합니다.서버에서 다른 곳으로 리디렉션할 POST를 처리하고 있습니까?아니면 규제자 GET 요청을 POST를 예상하는 다른 페이지로 리디렉션하시겠습니까?

어느 경우든 할 수 있는 일은 다음과 같습니다.

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

팝업 차단을 처리하려면 "자동으로 리디렉션되지 않으면 여기를 클릭하십시오"라는 링크를 만드는 것이 좋습니다.

위의 답변과 비슷하지만 다르게 적습니다.

$.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();
    }
});

제출하지 말고 버튼만 사용하는 것은 어떨까요?버튼을 클릭하면 브라우저가 리디렉션할 수 있는 적절한 URL을 구성할 수 있습니다.

$("#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);
});

데이터와 함께 제출할 jquery.reedirect.min.js 플러그인을 이 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();
    });

숨겨진 메소드 구성 및 작성 =window.location을 전혀 사용하지 않고 POST action="http://example.com/vote " 양식을 작성하여 제출합니다.

아니면

$('#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();

위의 용액을 표적으로 "extended"합니다.어떤 이유에서인지 게시물을 _blank 또는 다른 프레임으로 리디렉션할 수 있는 가능성이 필요했습니다.

$.extend(
   {
       redirectPost: function(location, args, target = "_self")
       {
           var form = $('<form></form>');
           form.attr("method", "post");
           form.attr("action", location);
           form.attr("target", target);
           $.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();
       }
   });

jquery redirect: https://github.com/mgalante/jquery.redirect 라는 jquery 플러그인을 사용할 수 있습니다.

포스트 데이터가 전달되고 새 페이지가 열린 상태로 리디렉션하려면 문서에 첨부된 구문을 사용할 수 있습니다.

$.redirect("/your_url.php", {user: "johnDoe", password: "12345"}, "POST", "_blank");

언급URL : https://stackoverflow.com/questions/19036684/jquery-redirect-with-post-data

반응형