새 탭이 아닌 새 탭에서 URL을 엽니 다.

2102

팝업 창과 달리 새 탭에서 URL 을 열려고합니다 .

응답이 다음과 같이 보이는 관련 질문을 보았습니다.

window.open(url,'_blank');
window.open(url);

그러나 그들 중 누구도 나를 위해 일하지 않았습니다. 브라우저는 여전히 팝업 창을 열려고했습니다.

javascript 
— 표
소스
85
이것은 일반적으로 선호되는 문제입니다. 일부 사람들은 창을 좋아하고 (이 동작을 강력하게 보호하고) 어떤 탭은 (이 동작을 강력하게 보호합니다). 그래서 당신은 일반적으로 디자인이 아닌 맛의 문제로 여겨지는 행동을 물리 칠 것입니다.
— Jared Farrish
42
Javascript는 브라우저와 탭 대 창에 대해 전혀 모르므로 새 창을 여는 방법을 결정하는 것은 브라우저에 달려 있습니다.
— Andrey
3
팝업이 아닌 새 탭에 표시되도록 Chrome을 구성하려면 어떻게해야하나요?
— Mark
8
Gmail은 어쨌든 적어도 Chrome 에서이 작업을 수행합니다. 이메일 행을 Shift + 클릭하면 해당 이메일을 새 창에서 엽니 다. Ctrl + 클릭하면 새 탭에서 열립니다. 유일한 문제 : Gmail의 난독 화 된 코드를 파는 것은 PITA입니다.
— Sergio
48
@Sergio는 모든 링크의 기본 브라우저 동작입니다. (최소한 Chrome 및 Firefox의 경우) Gmail과 관련이 없습니다.
— Qtax

답변:

929

저자가 할 수있는 일은 새 창 대신 새 탭에서 열도록 선택할 수 없습니다. 그것은 사용자 선호입니다 . (대부분의 브라우저에서 기본 사용자 환경 설정은 새 탭에 대한 것이므로 해당 환경 설정이 변경되지 않은 브라우저에서의 사소한 테스트는이를 보여주지 않습니다.)

CSS3는 target-new를 제안 했지만 사양은 폐기되었습니다 .

그 반대 는 사실이 아닙니다. 의 세 번째 인수에서 창의 크기를 지정 window.open()하면 환경 설정이 탭에 대한 것일 때 새 창을 트리거 할 수 있습니다.

— 쿠엔틴
소스
42
@AliHaideri Javascript는 새 탭 / 창을 여는 방법과 관련이 없습니다. 브라우저 설정에 따라 결정됩니다. 를 사용 window.open하면 브라우저에 새로운 것을 열도록 지시 한 다음 브라우저가 설정에서 선택한 항목 (탭 또는 창)을 엽니 다. 테스트 한 브라우저에서 탭 대신 새 창에서 열리도록 설정을 변경하면 다른 솔루션이 잘못되었음을 알 수 있습니다.
— Ian
239
다른 사람들에게 무언가를 말하는 것보다 시간을 낭비하는 두 가지 일은 할 수 없습니다. (1) 할 수없는 것을 말하면 할 수 있습니다. (2) 침묵을 지키고 할 수없는 일을 할 수있는 방법을 계속 찾게하십시오.
— Quentin
8
@Cupcake — 문서는 일반적으로 존재하지 않는 기능을 설명하지 않습니다. evernote.com/shard/s3/sh/428d2d68-39f9-491d-8352-8a9c217b67d7/…
— Quentin
9
@Neel — 간결하게 많은 사람들이 알고 싶은 주제에 도달하기 때문입니다.
— Quentin
4
작성자는 작업을 수행 할 수 있습니다 (주로 다른 코드 작성). 이러한 것 중 어느 것도 창 대신 탭을 트리거하지 않습니다.
— Quentin
1733

이것은 속임수입니다. 

function openInNewTab(url) {
  var win = window.open(url, '_blank');
  win.focus();
}

대부분의 경우 onclick팝업 차단기와 기본 "새 창"동작을 방지하기 위해 링크 처리기 에서 직접 발생합니다 . 이 방법으로 또는 이벤트 리스너를 DOM객체 에 추가하여 수행 할 수 있습니다 . 

<div onclick="openInNewTab('www.test.com');">Something To Click On</div>

http://www.tutsplanet.com/open-url-new-tab-using-javascript/

— 리엔 토 조지
소스
117
작동하지 않습니다. 검색 주소창 오른쪽에 팝업이 차단되었습니다 . 그런 다음 팝업을 허용했습니다. 그리고, 그것은 탭이 아닌 팝업으로 열립니다 ! OS X Lion의 Chrome 22.0.1229.94
— nalply
39
@ b1naryatr0phy 실제로 테스트하지 않았기 때문입니다. 브라우저에서 설정을 변경하십시오. 탭 또는 창에서 열리는 지 여부는 브라우저 설정에 따라 결정됩니다. window.open (또는 Javascript)을 호출하여 새 창 / 탭을 여는 방법을 선택하면 할 수있는 작업이 없습니다.
— Ian
질문 : 프로토콜없이 URL을 설정했습니다 (예 : my.site.com/Controller/Index). 결과적으로 현재 페이지의 URL과 같은 URL로 새 창 (탭)을 얻습니다 (OpenInNewTab 기능을 사용하는 곳에서) 및 함수 url에 전달되었습니다. 올바른 링크로 프로토콜 창이 열립니다. 왜?
— user2167382
2
var win = window.open (url, '_blank'); '_blank'는 필요하지 않습니다. window.open () 의 경우 두 번째 매개 변수는 strWindowName입니다. 새 창의 문자열 이름입니다. 이름은 <a> 또는 <form> 요소의 대상 속성을 사용하여 링크 및 양식의 대상으로 사용할 수 있습니다. 이름에는 공백 문자가 포함되지 않아야합니다. strWindowName은 새 창의 제목을 지정하지 않습니다.
— hydRAnger
샌드 박스 iframe이 아닌 새 탭을 열 수있는 방법이 있습니까? 이것을 사용하면 document.domain 값이 iframe으로 열릴 때 변경되지 않기 때문에 CORS 오류가 발생합니다.
— Ids van der Zee
380

window.open()실제 클릭 이벤트에서 발생하지 않으면 새 탭에서 열리지 않습니다. 주어진 예제에서 URL은 실제 클릭 이벤트에서 열립니다. 이것은 사용자가 브라우저에서 적절한 설정을 가지고 있다면 작동합니다 .

<a class="link">Link</a>
<script  type="text/javascript">
     $("a.link").on("click",function(){
         window.open('www.yourdomain.com','_blank');
     });
</script>

마찬가지로, 클릭 기능 내에서 Ajax 호출을 시도하고 성공시 창을 열려면 async : false옵션이 설정된 상태 에서 Ajax 호출을 수행하고 있는지 확인하십시오 .

— 벤 카트 코트라
소스
28
이것을 올바른 답변으로 표시하는 것이 좋을 것입니다. Chrome v26 (Windows)을 사용한 테스트에서 코드가 버튼의 클릭 핸들러 내에 있으면 새 탭이 열리고 코드가 프로그래밍 방식으로 (예 : 콘솔에서) 호출되면 새 창이 열립니다.
— CyberFonic
2
@Ian 기본 설정으로 브라우저에서 테스트 한 결과 위의 답변이 그렇지 않은 경우이 답변이 작동합니다. "할 수있는 작업이 없습니다"라는 답은 사용자가 기본 설정을 변경 한 경우에만 적용됩니다.
— Garfield
@Ian 명확성을 위해 사용자 설정에 대한 답변 경고에서 이것을 언급했습니다. "이것은 사용자가 브라우저에서 적절한 설정을 제공하면 작동합니다." 대부분의 사용자는 브라우저 설정을 변경하지 않으며이 답변은 대부분의 사용자에게 적합하다고 생각합니다.
— Venkat Kotra
async: falseChrome에서는 작동하지 않습니다. 콜백에서 새 창을 열려면 먼저 HTTP 요청을 보내기 전에 빈 창을 열고 나중에 업데이트해야합니다. 여기 좋은 핵이 있습니다.
— attacomsian
250

window.open 모든 브라우저의 새 탭에서 팝업을 안정적으로 열 수 없음

다른 브라우저는 window.open 특히 사용자의 브라우저 환경 설정과 관련하여 다른 방식으로 동작을 구현합니다 . window.open사용자의 브라우저 환경 설정을 처리하는 방식이 다르기 때문에 모든 Internet Explorer, Firefox 및 Chrome 에서 동일한 동작이 적용 되는 것을 기대할 수는 없습니다 .

예를 들어 Internet Explorer (11) 사용자는 새 창이나 새 탭에서 팝업을 열도록 선택할 수 있습니다 . Quentin의 답변 에서 설명한 것처럼 Internet Explorer 11 사용자가을 통해 특정 방식으로 팝업을 열도록 할 수는 없습니다 .window.open

Firefox (29) 사용자의 경우 window.open(url, '_blank') 브라우저의 탭 환경 설정에 따라 사용 하지만 너비와 높이를 지정하여 새 창에서 팝업을 강제로 열 수는 있습니다 (아래 "Chrome 정보"섹션 참조).

데모

브라우저 설정으로 이동하여 새 창에서 팝업을 열도록 구성하십시오.

인터넷 익스플로러 (11)

Internet Explorer 설정 대화 상자 1

Internet Explorer 탭 설정 대화 상자

테스트 페이지

위에서 설명한대로 새 창에서 팝업을 열도록 Internet Explorer (11)를 설정 한 후 다음 테스트 페이지를 사용하여 테스트하십시오 window.open.

<!DOCTYPE html>
<html>
  <head>
    <title>Test</title>
  </head>

  <body>
    <button onclick="window.open('https://stackoverflow.com/q/4907843/456814');">
      <code>window.open(url)</code>
    </button>
    <button onclick="window.open('https://stackoverflow.com/q/4907843/456814', '_blank');">
      <code>window.open(url, '_blank')</code>
    </button>
  </body>
</html>

팝업이 새 탭이 아닌 새 창에서 열리는 지 확인 하십시오.

탭 환경 설정이 새 창으로 설정된 상태에서 Firefox (29)에서 위의 스 니펫을 테스트하고 동일한 결과를 볼 수 있습니다.

Chrome은 어떻습니까? window.openInternet Explorer (11) 및 Firefox (29)와는 다르게 구현 됩니다.

100 % 확실하지는 않지만 Chrome (버전 34.0.1847.131 m)에 사용자가 새 창에서 팝업을 열지 여부를 선택하는 데 사용할 수있는 설정이없는 것처럼 보입니다 (Firefox 및 Internet Explorer와 같은) 있다). 팝업 관리를 위해 Chrome 설명서를 확인 했지만 그 종류에 대해서는 언급하지 않았습니다.

또한 다시 한 번 다른 브라우저는 window.open 다르게 동작을 구현하는 것으로 보입니다 . Chrome과 Firefox에서 너비와 높이를 지정하면 사용자가 Firefox (29)가 새 탭에서 새 창을 열도록 설정 한 경우에도 팝업 이 표시됩니다 (탭이 아닌 새 창에서 열린 JavaScript 에 대한 답변에서 언급 한 것처럼 ) :

<!DOCTYPE html>
<html>
  <head>
    <title>Test</title>
  </head>

  <body>
    <button onclick="window.open('https://stackoverflow.com/q/4907843/456814', 'test', 'width=400, height=400');">
      <code>window.open(url)</code>
    </button>
  </body>
</html>

그러나 사용자가 탭을 브라우저 환경 설정으로 설정 한 경우 위의 동일한 코드 스 니펫 은 Internet Explorer 11에서 항상 새 탭을 엽니 다. 하고 너비와 높이를 지정하지 않아도 .

따라서 window.openChrome 에서 동작은 onclick이벤트에 사용될 때 새 탭에서 팝업 을 열고 브라우저 콘솔에서 사용될 때 새 창에서 팝업을 여는 것으로 보입니다 ( 다른 사람들이 언급 한 것처럼) ), 및 새 창시에서 열을 너비와 높이로 지정됩니다.

요약

다른 브라우저는 window.open 사용자의 브라우저 환경 설정과 관련하여 다르게 동작을 구현합니다 . 당신은 같은 행동을 기대할 수 없습니다window.open사용자의 브라우저 환경 설정을 처리하는 방식이 다르기 때문에 모든 Internet Explorer, Firefox 및 Chrome 되는 것을 .

추가 자료

— 피터 모텐슨
소스
12
당신은 질문에 대답하지 않고 방금 window.open이 일관성이 없음을 증명했습니다.
— BentOnCoding
223

짧막 한 농담:

Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click();

가상 a요소를 만들어 target="_blank"새 탭에서 열어서 적절하게 제공 url href한 다음 클릭합니다.

그리고 원하는 경우이를 바탕으로 몇 가지 기능을 만들 수 있습니다.

function openInNewTab(href) {
  Object.assign(document.createElement('a'), {
    target: '_blank',
    href,
  }).click();
}

그런 다음 다음과 같이 사용할 수 있습니다.

openInNewTab("https://google.com");

중요 사항:

openInNewTab(이 페이지의 다른 솔루션뿐만 아니라)도 사용자 작업 콜백 중에 호출해야합니다 (예 : 내부 클릭 이벤트 (콜백 함수에서 직접 필요하지 않지만 클릭 동작 중).

임의의 임의의 순간에 (예 : 간격 내부 또는 서버 응답 후) 수동으로 호출하는 경우 브라우저에 의해 차단 될 수 있습니다 (보안 위험이 있으므로 사용자 경험이 매우 열악 할 수 있음) )

— 파이
소스
8
감사합니다. 순수 JS에는 누락 된 부분이 있습니다 .Luke Alderton이 작성한 것처럼 (아래 참조) 작성된 요소를 문서 본문에 첨부해야합니다. 코드에서는 Firefox 37에서 공백에 매달려 있습니다. 아무 것도하지 않습니다. .
— greenoldman
4
@mcginniwa 이와 같은 동작-마우스 클릭과 같은 사용자 동작에 의해 트리거되지 않으면 팝업 차단기가됩니다. 사용자 조치없이 자바 스크립트로 URL을 열 수 있다고 상상해보십시오. 매우 위험합니다. 클릭 코드와 같은 이벤트 에이 코드를 넣으면 정상적으로 작동합니다. 여기에서 제안 된 모든 솔루션과 동일합니다.
— pie6k
4
다음과 같이 코드를 단순화 할 수 있습니다. $('<a />',{'href': url, 'target', '_blank'}).get(0).click();
— shaedrich
5
@shaedrich는 당신의 도약에서 영감을 받았습니다. jquery가 아닌 라이너를 추가했습니다.Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click();
— pie6k
FF에서는 작동하지 않습니다!
— Nolesh
91

를 사용하면 window.open(url, '_blank')Chrome에서 차단 (팝업 차단)됩니다.

이 시도:

//With JQuery

$('#myButton').click(function () {
    var redirectWindow = window.open('http://google.com', '_blank');
    redirectWindow.location;
});

순수한 JavaScript로

document.querySelector('#myButton').onclick = function() {
    var redirectWindow = window.open('http://google.com', '_blank');
    redirectWindow.location;
};
— 더 안전한 모하메드
소스
그러나이 질문에서 그들은 사이트 작성자에 대해 언급하지 않습니다. 새 창이나 새 탭에서만 URL을 열려고합니다. 이것은 브라우저에 따라 다릅니다. 저자에 대해 신경 쓰지 않아도됩니다. 그 바이올린을 확인하십시오. 작동 중
— Mohammed Safeer
js fiddle 및 plunker에서는 작동하지 않지만 html 파일을 만들 때 작동합니다. 그것은 js 바이올린, 출력이 iframe에 표시되기 때문입니다.the request was made in a sandboxed frame whose 'allow-popups' permission is not set
— Mohammed Safeer
67

Steven Spielberg의 답변을 자세히 설명하기 위해 나는 이런 경우에 이렇게했습니다.

$('a').click(function() {
  $(this).attr('target', '_blank');
});

이렇게하면 브라우저가 대상 속성을 설정하는 링크를 따라 가기 직전에 링크가 새 탭이나 창에서 열립니다 ( 사용자 설정에 따라 다름 ).

jQuery의 한 줄 예 :

$('a').attr('target', '_blank').get(0).click();
// The `.get(0)` must be there to return the actual DOM element.
// Doing `.click()` on the jQuery object for it did not work.

기본 브라우저 DOM API를 사용하여 수행 할 수도 있습니다.

document.querySelector('a').setAttribute('target', '_blank');
document.querySelector('a').click();
— 아크릭
소스
57

나는 다음을 사용하며 매우 잘 작동합니다!

window.open(url, '_blank').focus();
— 에스 퀴아 가르시아
소스
2
브라우저 설정에 따라 새 탭이나 창에서 열릴 수 있습니다. 환경 설정이 새 창에 대한 것이더라도 새 탭을 여는 것에 대한 질문입니다.
— Quentin
19

흥미로운 사실은 사용자가 조치를 호출하지 않거나 (버튼 또는 무언가 클릭) 비동기식 인 경우 새 탭에서 열 수 없다는 것입니다.

$.ajax({
    url: "url",
    type: "POST",
    success: function() {
        window.open('url', '_blank');              
    }
});

그러나 브라우저 설정에 따라 새 탭에서 열릴 수 있습니다.

$.ajax({
    url: "url",
    type: "POST",
    async: false,
    success: function() {
        window.open('url', '_blank');              
    }
});
— 카라 수나
소스
2
Firefox 28, Chrome 34b 및 Safari 7.0.2의 모든 스톡 설정에서 팝업으로 차단되었습니다. :(
— Steve Meisner
1
"사용자가 조치를 호출하지 않거나 (버튼 또는 무언가 클릭) 비동기 인 경우 새 탭을 열 수 없음" -Chrome에서는 true이지만 모든 브라우저에서는 그렇지 않습니다. 저장 <script>open('http://google.com')</script>A와 .html파일은 파이어 폭스의 최신 버전 새로 설치에서 엽니 다; Firefox는 새 창이 아닌 새 탭에서 팝업을 허용 한 후 Google을 행복하게 여는 것을 볼 수 있습니다.
— Mark Amery
13

[strWindowFeatures] 매개 변수를 생략하면 브라우저 설정이 재정의되지 않는 한 (브라우저 설정이 JavaScript보다 우선) 새 탭이 열립니다.

새창

var myWin = window.open(strUrl, strWindowName, [strWindowFeatures]);

새로운 탭

var myWin = window.open(strUrl, strWindowName);

-또는-

var myWin = window.open(strUrl);
— 매니
소스
11 
(function(a){
document.body.appendChild(a);
a.setAttribute('href', location.href);
a.dispatchEvent((function(e){
    e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, true, false, false, false, 0, null);
    return e
}(document.createEvent('MouseEvents'))))}(document.createElement('a')))
— 스피 린 블라디미르
소스
11

다음과 같은 트릭을 사용할 수 있습니다 form.

$(function () {
    $('#btn').click(function () {
        openNewTab("http://stackoverflow.com")
        return false;
    });
});

function openNewTab(link) {
    var frm = $('<form   method="get" action="' + link + '" target="_blank"></form>')
    $("body").append(frm);
    frm.submit().remove();
}

jsFiddle 데모

— 코드 닌자
소스
4
이 방법을 사용하는 경우 양식 제출로 건너 뛰기 때문에 URL에 쿼리 매개 변수가 없는지 확인하십시오. 한 가지 해결책은 쿼리 매개 변수 내의 모든 매개 변수에 대한 name키 및 value값을 가진 숨겨진 입력 요소를 양식 요소 내에 포함시키는 것 입니다. 그리고 양식을 제출
— Mudassir 알리
a폼 대신 태그를 사용하여 jQuery .click()메소드를 사용하여 "제출"하는 것이 더 간단 합니다. 내 답변
10

사용자 정의 기능에서 새 탭을 열려고하면 브라우저 설정과 관련이 없습니다 .

이 페이지에서 JavaScript 콘솔을 열고 다음을 입력하십시오.

document.getElementById("nav-questions").setAttribute("target", "_blank");
document.getElementById("nav-questions").click();

'클릭'은 사용자 지정 작업에서 가져 오기 때문에 설정에 관계없이 팝업을 열려고 시도합니다.

링크에서 실제 '마우스 클릭'처럼 동작하려면 따라야합니다. spirinvladimir의 조언 @ 그리고 정말 그것을 만들 :

document.getElementById("nav-questions").setAttribute("target", "_blank");
document.getElementById("nav-questions").dispatchEvent((function(e){
  e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                    false, false, false, false, 0, null);
  return e
}(document.createEvent('MouseEvents'))));

다음은 완전한 예제입니다 ( jsFiddle 또는 유사한 온라인 편집기에서는 시도하지 마십시오. 외부 페이지로 리디렉션 할 수 없음).

<!DOCTYPE html>
<html>
<head>
  <style>
    #firing_div {
      margin-top: 15px;
      width: 250px;
      border: 1px solid blue;
      text-align: center;
    }
  </style>
</head>
<body>
  <a id="my_link" href="http://www.google.com"> Go to Google </a>
  <div id="firing_div"> Click me to trigger custom click </div>
</body>
<script>
  function fire_custom_click() {
    alert("firing click!");
    document.getElementById("my_link").dispatchEvent((function(e){
      e.initMouseEvent("click", true, true, window, /* type, canBubble, cancelable, view */
            0, 0, 0, 0, 0,              /* detail, screenX, screenY, clientX, clientY */
            false, false, false, false, /* ctrlKey, altKey, shiftKey, metaKey */
            0, null);                   /* button, relatedTarget */
      return e
    }(document.createEvent('MouseEvents'))));
  }
  document.getElementById("firing_div").onclick = fire_custom_click;
</script>
</html>
— Chipairon
소스
1
나는 내가 다른 솔루션에가는 결국 w = window.open("placeholder"); $.ajax(...ajax call that returns the url...) success (...w.location = data.url...)당 theandystratton.com/2012/...
— 폴 Tomblin에게
11
@FahadAbidJanjua 그것은 정확 하지 않습니다 . 여전히 브라우저 설정에 따라 다릅니다. HTML 또는 Javascript 스펙에는 "사용자 정의 조치"가 탭이 아닌 팝업으로 열리도록 선언하는 것이 없습니다. 실제로 현재 컴퓨터의 브라우저 중 어느 것도이 동작을 표시 하지 않습니다 .
— nmclean
7 
function openTab(url) {
  const link = document.createElement('a');
  link.href = url;
  link.target = '_blank';
  document.body.appendChild(link);
  link.click();
  link.remove();
}
— 앤드류 루카
소스
1
브라우저 설정에 따라 새 탭이나 창에서 열릴 수 있습니다. 환경 설정이 새 창에 대한 것이더라도 새 탭을 여는 것에 대한 질문입니다.
— Quentin
3

JQuery

$('<a />',{'href': url, 'target': '_blank'}).get(0).click();

JS

Object.assign(document.createElement('a'), { target: '_blank', href: 'URL_HERE'}).click();
— 브라이언
소스
브라우저 설정에 따라 새 탭이나 창에서 열릴 수 있습니다. 환경 설정이 새 창에 대한 것이더라도 새 탭을 여는 것에 대한 질문입니다.
— Quentin
2

또는 링크 요소를 만들어 클릭하면됩니다.

var evLink = document.createElement('a');
evLink.href = 'http://' + strUrl;
evLink.target = '_blank';
document.body.appendChild(evLink);
evLink.click();
// Now delete it
evLink.parentNode.removeChild(evLink);

팝업 차단기에 의해 차단되어서는 안됩니다.

— 루크 앨더 턴
소스
2

이 질문에 대한 답이 있으며 그렇지 않습니다.

나는 쉬운 해결책을 찾았습니다.

1 단계 : 보이지 않는 링크 만들기

<a id="yourId" href="yourlink.html" target="_blank" style="display: none;"></a>

2 단계 : 프로그래밍 방식으로 해당 링크를 클릭하십시오.

document.getElementById("yourId").click();

여기 있습니다! 나를 위해 매력을 작동시킵니다.

— 알 즐퍼
소스
브라우저 설정에 따라 새 탭이나 창에서 열릴 수 있습니다. 환경 설정이 새 창에 대한 것이더라도 새 탭을 여는 것에 대한 질문입니다.
— Quentin
1

여기에 이미지 설명을 입력하십시오

새 탭을 열고 동일한 탭을 유지하는 방법에 대한 많은 정보를 연구했습니다. 나는 그것을 할 작은 트릭을 발견했습니다. newUrl 및 old url- currentUrl 을 열어야하는 URL이 있다고 가정 하고 새 탭을 연 후에도 유지해야합니다. JS 코드는 다음과 같습니다.

// init urls
let newUrl = 'http://example.com';
let currentUrl = window.location.href;
// open window with url of current page, you will be automatically moved 
// by browser to a new opened tab. It will look like your page is reloaded
// and you will stay on same page but with new page opened
window.open(currentUrl , '_blank');
// on your current tab will be opened new url
location.href = newUrl;
— 바하
소스
문제는 사용자가 기본 설정을 새 창에서 열 때 새 탭을 여는 것에 관한 것입니다. 기존 탭에서 다른 URL을 동시에 여는 동안 새 탭에서 URL을 여는 방법을 묻지 않습니다.
— Quentin
0

<a>with _blankas target속성 값을 가진 as 를 작성하고 스타일 디스플레이를 사용 하여 urlas href: 어린이 요소로 숨겨져 있습니까? 그런 다음 DOM에 추가 한 다음 children 요소에서 click 이벤트를 트리거하십시오.

최신 정보

작동하지 않습니다. 브라우저는 기본 동작을 방지합니다. 프로그래밍 방식으로 트리거 될 수 있지만 기본 동작을 따르지 않습니다.

직접 확인하고 참조하십시오 : http://jsfiddle.net/4S4ET/

— 승리자
소스
-1

Firefox (Mozilla) 확장 내에서 새 탭을 여는 방법은 다음과 같습니다.

gBrowser.selectedTab = gBrowser.addTab("http://example.com");
— 스마일
소스
-1

이 방법은 위의 솔루션과 유사하지만 다르게 구현됩니다.

.social_icon-> CSS가있는 클래스 

 <div class="social_icon" id="SOME_ID" data-url="SOME_URL"></div>


 $('.social_icon').click(function(){

        var url = $(this).attr('data-url');
        var win = window.open(url, '_blank');  ///similar to above solution
        win.focus();
   });
— CG_DEV
소스
-1

이것은 해킹 일 수 있지만 Firefox에서 세 번째 매개 변수 'fullscreen = yes'를 지정하면 새로운 창이 열립니다.

예를 들어

<a href="#" onclick="window.open('MyPDF.pdf', '_blank', 'fullscreen=yes'); return false;">MyPDF</a>

실제로 브라우저 설정을 무시하는 것 같습니다.

— 쿠날
소스
-1

이 작업은 나를 위해 이벤트를 방지하고 URL을 추가 한 <a> tag다음 클릭 이벤트를 트리거합니다 tag.

Js
$('.myBtn').on('click', function(event) {
        event.preventDefault();
        $(this).attr('href',"http://someurl.com");
        $(this).trigger('click');
});
HTML
<a href="#" class="myBtn" target="_blank">Go</a>
— 카를로스 살라자르
소스
브라우저 설정에 따라 새 탭이나 창에서 열릴 수 있습니다. 환경 설정이 새 창에 대한 것이더라도 새 탭을 여는 것에 대한 질문입니다.
— Quentin
-1

는 window.open(url)새 브라우저 탭에서 URL을 엽니 다. 아래의 JS 대안

let a= document.createElement('a');
a.target= '_blank';
a.href= 'https://support.wwf.org.uk/';
a.click(); // we don't need to remove 'a' from DOM because we not add it

여기에 실례가 있습니다 (스택 오버 플로우 스 니펫은 새 탭을 열 수 없습니다)

— 카밀 키에브 제 스키
소스
"windows.open (url)은 새 브라우저 탭에서 URL을 엽니 다"— 새 창 또는 새 탭에 대한 사용자의 기본 설정을 따릅니다. 환경 설정이 창에 대한 경우 새 탭을 강제로 적용하지 않습니다. (질문은 무엇입니까). target = _blank에도 동일하게 적용됩니다.
— Quentin
제안한 두 가지 접근 방식은이 질문에 대한 이전의 삭제되지 않은 56 개의 답변에서 여러 번 언급되고 비판되었습니다.
— Quentin
-1

새 탭 또는 새 창에서 URL을 열지 여부는 실제로 사용자의 브라우저 환경 설정에 의해 제어됩니다. JavaScript에서는이를 재정의 할 방법이 없습니다.

window.open()사용 방법에 따라 다르게 작동합니다. 사용자 작업의 직접적인 결과로 호출 되면 버튼 클릭이라고 말하면 정상적으로 작동하고 새 탭 (또는 창)을 열어야합니다.

const button = document.querySelector('#openTab');

// add click event listener
button.addEventListener('click', () => {
    // open a new tab
    const tab = window.open('https://attacomsian.com', '_blank');
});

그러나 AJAX 요청 콜백에서 새 탭 을 열려고 하면 브라우저가 직접 사용자 작업이므로 해당 탭을 차단합니다.

팝업 차단기 를 우회하고 콜백에서 새 탭을 열려면 약간의 해킹이 있습니다 .

const button = document.querySelector('#openTab');

// add click event listener
button.addEventListener('click', () => {

    // open an empty window
    const tab = window.open('about:blank');

    // make an API call
    fetch('/api/validate')
        .then(res => res.json())
        .then(json => {

            // TODO: do something with JSON response

            // update the actual URL
            tab.location = 'https://attacomsian.com';
            tab.focus();
        })
        .catch(err => {
            // close the empty window
            tab.close();
        });
});
— attacomsian
소스
-1

나는이 방법을 시도했지만 잘 작동하는 것 같습니다

window.open('example.com', 'newWin');

나는 여기에서 많은 실례를 발견했다.

http://www.gtalbot.org/FirefoxSection/Popup/PopupAndFirefox.html#TestPopupControl

— 아르 템 셰 우트 소프
소스
사용자의 환경 설정에 따라 새 탭이나 창에서 열립니다. 질문에 관한 새로운 탭을 강요하지 않습니다.
— Quentin
OP가 이미 시도했을 때 질문에서 조금 빗 나갔습니까? 또는 stackoverflow.com/a/59565074/19068 ? 또는 stackoverflow.com/a/35939565/19068 ? 또는 stackoverflow.com/a/30512485/19068 ? 또는 stackoverflow.com/a/11384018/19068 ? 또는 stackoverflow.com/a/26990478/19068 ?
— Quentin
@Quentin 그 부분을 놓쳤지만 두 번째 매개 변수«windowName»이«_blank»와 같거나 전혀없는 window.open을 호출하려고 할 때 팝업 또는 새 탭이 최신 Chrome에 나타나지 않았습니다. 창 이름을«newWin»으로 변경하면 새 탭이 열립니다. 창 이름 매개 변수가 선택적이므로 이상합니다.
— Artem Shevtsov
-4

다음과 같이 쓴 사람 (여기에 설명되어 있음)과 다소 동의합니다. "기존 웹 페이지의 링크의 경우 새 페이지가 동일한 웹 사이트의 일부인 경우 브라우저는 항상 새 탭에서 링크를 엽니 다 기존 웹 페이지 " 나에게 적어도이 "일반 규칙"은 Chrome, Firefox, Opera, IE, Safari, SeaMonkey 및 Konqueror에서 작동합니다.

어쨌든 상대방이 제시 한 것을 활용하는 덜 복잡한 방법이 있습니다. 브라우저가 수행하는 작업을 제어하려는 경우 자신의 웹 사이트 (아래 "thissite.com")에 대해 이야기하고 있다고 가정하면 "specialpage.htm"이 비어 있고 HTML이 전혀 없어야합니다 ( 서버에서 데이터를 보내는 시간을 절약합니다!).

 var wnd, URL;  //global variables

 //specifying "_blank" in window.open() is SUPPOSED to keep the new page from replacing the existing page
 wnd = window.open("http://www.thissite.com/specialpage.htm", "_blank"); //get reference to just-opened page
 //if the "general rule" above is true, a new tab should have been opened.
 URL = "http://www.someothersite.com/desiredpage.htm";  //ultimate destination
 setTimeout(gotoURL(),200);  //wait 1/5 of a second; give browser time to create tab/window for empty page


 function gotoURL()
 { wnd.open(URL, "_self");  //replace the blank page, in the tab, with the desired page
   wnd.focus();             //when browser not set to automatically show newly-opened page, this MAY work
 }
— 버논 너
소스
-7

외부 링크 (다른 사이트로 이동하는 링크) 만 열려면이 비트의 JavaScript / jQuery가 잘 작동합니다.

$(function(){
    var hostname = window.location.hostname.replace('www.', '');
    $('a').each(function(){
        var link_host = $(this).attr('hostname').replace('www.', '');
        if (link_host !== hostname) {
            $(this).attr('target', '_blank');
        }
    });
});
— Michael
소스
이 답변은이 질문에 적합하지 않지만 매우 유용한 생각입니다! 당신의 아이디어에 감사드립니다!
— 누리 악만
-9

링크가 동일한 도메인 (동일한 웹 사이트)에있는 경우 브라우저는 항상 새 탭에서 링크를 엽니 다. 링크가 다른 도메인에있는 경우 브라우저 설정에 따라 새 탭 / 창에서 링크가 열립니다.

따라서 이것에 따르면 다음을 사용할 수 있습니다.

<a class="my-link" href="http://www.mywebsite.com" rel="http://www.otherwebsite.com">new tab</a>

그리고 jQuery 코드를 추가하십시오.

jQuery(document).ready(function () {
    jQuery(".my-link").on("click",function(){
        var w = window.open('http://www.mywebsite.com','_blank');
        w.focus();
        w.location.href = jQuery(this).attr('rel');
        return false;
    });
});

따라서 먼저 동일한 웹 사이트에서 _blank 대상으로 새 창을 열고 (새 탭에서 열림) 새 창에서 원하는 웹 사이트를여십시오.

— loshMiS
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.