[Javascript] 다른 웹 페이지로 리디렉션하는 방법은 무엇입니까?


Answers

경고 : 이 대답은 가능한 해결책으로 제공되었을뿐입니다. 그것은 jQuery를 필요로하기 때문에 분명히 최선의 해결책은 아닙니다 . 대신 순수한 JavaScript 솔루션을 선호하십시오.

$(location).attr('href', 'http://stackoverflow.com')
Question

jQuery 또는 순수한 JavaScript를 사용하여 한 페이지에서 다른 페이지로 사용자를 리디렉션 할 수 있습니까?







ECMAScript 6 + jQuery, 85 바이트

$({jQueryCode:(url)=>location.replace(url)}).attr("jQueryCode")("http://example.com")

제발 날 죽이지 마세요, 농담이에요. 그것은 농담. 이건 농담이다.

이것은 "질문에 대한 답을 제공합니다"라는 의미에서 "jQuery 사용"솔루션을 요청했습니다.이 경우에는 어떻게 든 방정식에 강제 적용됩니다.

Ferrybig는 분명히 농담이 설명 될 필요가있다. (아직도 농담, 나는 리뷰 형태에 제한적인 옵션이있다)

다른 대답은 불필요하게 location 또는 window 개체에 jQuery의 attr() 사용하고 location .

이 대답은 또한 그것을 학대하지만 더 우스운 방법으로. 이를 사용하여 위치를 설정하는 대신 attr() 을 사용하여 위치를 설정하는 함수를 검색합니다.

이 함수는 jQueryCode 라는 이름이 jQueryCode 는 않지만 jQuery는 없다. somethingCode 라는 함수를 호출하는 것은 끔찍한 일이다.

"85 바이트"는 코드 골프에 대한 참조입니다. 골프는 분명히 코드 골프 밖에서해야 할 일이 아니며, 실제로이 답변은 실제로 골프를 치는 것이 아닙니다.

기본적으로, 싫증이 나.




jQuery는 필요하지 않습니다. 당신은 이것을 할 수 있습니다 :

window.open("URL","_self","","")

그것은 쉽다!

HTTP 요청을 시작하는 가장 좋은 방법은 document.loacation.href.replace('URL') 입니다.




난 그냥 또 다른 최신 jQuery 메서드 로이 어리 석음을 업데이 트했다 :

var url = 'http://www.fiftywaystoleaveyourlocation.com';
$(location).prop('href', url);



이것은 jQuery와 작동합니다 :

$(window).attr("location", "http://google.fr");



먼저 올바르게 작성하십시오. 다른 링크를 위해 응용 프로그램 내에서 다른 링크를 탐색하려고합니다. 다음은 코드입니다.

window.location.href = "http://www.google.com";

원하는 경우 응용 프로그램 내에서 페이지를 탐색하려는 경우 코드가 있습니다.




var url = 'asdf.html';
window.location.href = url;



용도:

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')


// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')



기본적으로 jQueryJavaScript 라이브러리이며 리디렉션과 같은 일부 작업을 수행 할 때는 순수한 JavaScript를 사용할 수 있으므로이 경우 바닐라 JavaScript를 사용하는 3 가지 옵션이 있습니다.

1) 위치 대체를 사용하면 페이지의 현재 기록을 대체하므로 뒤로 버튼을 사용하여 원래 페이지로 돌아갈 수 없음을 의미합니다.

window.location.replace("http://.com");

2) 위치 지정 기능을 사용하면 기록을 보관할 수 있으며 뒤로 버튼을 사용하면 원래 페이지로 돌아갈 수 있습니다.

window.location.assign("http://.com");

3) 이전 방법 중 하나를 사용하는 것이 좋지만이 방법은 순수 JavaScript를 사용하는 세 번째 옵션 일 수 있습니다.

window.location.href="http://.com";

또한 jQuery에서이 함수를 처리 할 수는 있지만 단 한 줄의 JavaScript 함수이기 때문에 권장하지는 않습니다. 이미 window 범위에 있다면 window없이 위의 모든 함수를 사용할 수 있습니다 (예 : window.location.replace("http://.com"); location.replace("http://.com"); 수 있습니다 location.replace("http://.com");

또한 나는 아래 이미지에서 그들 모두를 보여줍니다 :




그러나 누군가 홈 페이지로 다시 리디렉션하려는 경우 다음 스 니펫을 사용할 수 있습니다.

window.location = window.location.host

개발, 스테이징 및 프로덕션과 같은 세 가지 환경이 있다면 도움이됩니다.

Chrome 콘솔이나 Firebug 콘솔에이 단어를 넣어서이 창이나 window.location 객체를 탐색 할 수 있습니다.




따라서 질문은 리디렉션 페이지를 만드는 방법이지 웹 사이트로 리디렉션하지 않는 방법입니까?

이를 위해 JavaScript 만 사용하면됩니다. 다음은 동적 리디렉션 페이지를 생성하는 몇 가지 작은 코드입니다.

<script>
    var url = window.location.search.split('url=')[1]; // Get the URL after ?url=
    if( url ) window.location.replace(url);
</script>

따라서이 스 니펫을 웹 사이트의 redirect/index.html 파일에 넣으면 좋습니다.

http://www.mywebsite.com/redirect?url=http://.com

그리고 그 링크를 클릭하면 자동으로 .com 으로 리디렉션됩니다.

문서 링크

그리고 이것이 바로 JavaScript로 간단한 리디렉션 페이지를 만드는 방법입니다.

편집하다:

한가지주의해야 할 것이 있습니다. 리디렉션 페이지에 적합하다고 생각하기 때문에 window.location.replace 를 추가했습니다. 그러나 window.location.replace 사용 window.location.replace 리디렉션되고 브라우저에서 뒤로 버튼을 누르면 리디렉션 페이지로 돌아 왔고, 그 페이지로 돌아가서이 작은 데모를 봅니다.

예:

프로세스 : 홈페이지 저장 => google => google로 페이지 리디렉션

언제 google에서 : google => 브라우저에서 뒤로 버튼 => 집에 저장

그래서 이것이 당신의 요구에 맞는다면 모든 것이 잘되어야합니다. 브라우저 기록에 리디렉션 페이지를 포함 시키려면 이것을 바꿉니다.

if( url ) window.location.replace(url);

if( url ) window.location.href = url;



자신이하려는 일에 대해 조금 더 설명력이 있다면 도움이 될 것입니다. 페이징 된 데이터를 생성하려는 경우이를 수행하는 방법에 몇 가지 옵션이 있습니다. 직접 가져올 수있는 각 페이지마다 별도의 링크를 생성 할 수 있습니다.

<a href='/path-to-page?page=1' class='pager-link'>1</a>
<a href='/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...

예제의 현재 페이지는 코드와 CSS에서 다르게 처리됩니다.

페이징 된 데이터를 AJAX를 통해 변경하려면 jQuery가 들어갈 곳을 선택하십시오. 다른 페이지에 해당하는 각 앵커 태그에 클릭 핸들러를 추가하면됩니다. 이 클릭 핸들러는 AJAX를 통해 다음 페이지를 가져 와서 새 데이터로 테이블을 업데이트하는 jQuery 코드를 호출합니다. 아래 예제에서는 새 페이지 데이터를 반환하는 웹 서비스가 있다고 가정합니다.

$(document).ready( function() {
    $('a.pager-link').click( function() {
        var page = $(this).attr('href').split(/\?/)[1];
        $.ajax({
            type: 'POST',
            url: '/path-to-service',
            data: page,
            success: function(content) {
               $('#myTable').html(content);  // replace
            }
        });
        return false; // to stop link
    });
});



페이지로 리디렉션하는 방법은 다음과 같습니다.

  window.location.href = "/destination.html";

또는 지연이 필요한 경우 :

setTimeout(function () {
  window.location.href = "/destination.html";
}, 2000);   // Time in milliseconds

jQuery를 사용하면 웹 페이지에서 요소를 쉽게 선택할 수 있습니다. 페이지에서 원하는 항목을 찾은 다음 jQuery를 사용하여 특수 효과를 추가하거나 사용자 동작에 반응하거나 선택한 요소 내부 또는 외부에있는 내용을 표시하거나 숨길 수 있습니다. 이러한 모든 작업 은 요소를 선택하는 방법부터 시작합니다.

function redirect () {
    $('selection').animate({
        marginLeft: 100px; //Put some CSS animation here
    }, 500, function () {
      // OK, finished jQuery staff, let's go redirect
      window.location.href = "/destination.html";
})

누군가 10000 줄의 코드 인 스크립트 / 플러그인을 작성했다고 상상해보십시오! 자, jQuery를 사용하면 한 줄 또는 두 줄만으로이 코드에 연결할 수 있습니다.




이를 수행하는 세 가지 주요 방법이 있습니다.

window.location.href='blaah.com';
window.location.assign('blaah.com');

과...

window.location.replace('blaah.com');

마지막 리디렉션은 검색 기록에서 리디렉션되기 전에 방문한 페이지를 저장하지 않기 때문에 일반적인 리디렉션의 경우 가장 좋습니다. 그러나 JavaScript로 탭을 열려면 위의 방법 중 하나를 사용하면됩니다. 1

편집 : window 접두사는 선택 사항입니다.