No error , No gain

Question 1

팝업 창이 아닌 새 탭에서 URL 을 열려고 합니다.

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

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

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

Question 2

이것은 트릭이며,

 function openInNewTab(url) { window.open(url, '_blank').focus(); } //or just window.open(url, '_blank').focus();

onclick 핸들러와 기본 "새 창" 동작에서 직접 발생해야 합니다. DOM 객체에 이벤트 리스너를 추가하여 수행할 수 있습니다.

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

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

Question 3

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

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

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

Question 4

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 호출을 수행하고 있는지 확인하십시오.

Question 5

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

가상 요소를 만들고 target="_blank"를 지정하여 새 탭에서 열리고 적절한 URL href를 제공한 다음 클릭합니다.

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

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

중요 사항:

openInNewTab (및 이 페이지의 다른 솔루션)은 소위 '신뢰할 수 있는 이벤트' 콜백 중에 호출되어야 합니다. 클릭 이벤트 (직접 콜백 기능에 필요하지만, 클릭 동작시하지 않음) 동안. 그렇지 않으면 새 페이지를 여는 것이 브라우저에 의해 차단됩니다

임의의 순간에 수동으로 호출하는 경우(예: 간격 내 또는 서버 응답 후) - 브라우저에 의해 차단될 수 있습니다(보안 위험이 되고 사용자 경험이 좋지 않을 수 있으므로 의미가 있음)

Question 6

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

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

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

Firefox(29) 사용자의 경우 window.open(url, '_blank') 은 브라우저의 탭 기본 설정에 따라 다르지만 너비와 높이를 지정하여 새 창에서 팝업을 열도록 할 수 있습니다("What About 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)에서 위의 스니펫을 테스트하고 동일한 결과를 볼 수도 있습니다.

크롬은 어떻습니까? Internet Explorer(11) 및 Firefox(29)와 다르게 `window.open` 구현합니다.

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.open 의 동작은 onclick 이벤트에서 사용될 때 새 탭에서 팝업을 열고 브라우저 콘솔에서 사용할 때 새 창에서 열고( 다른 사람들이 언급한 대로) 팝업을 여는 것 같습니다. 너비와 높이로 지정된 경우 새 창에서.

요약

다른 브라우저는 사용자의 브라우저 기본 설정과 관련하여 window.open 사용자의 브라우저 기본 설정을 처리하는 방식이 다르기 때문에 모든 Internet Explorer, Firefox 및 Chrome에서 window.open 에 대해 동일한 동작을 기대할 수는 없습니다.

추가 읽기

window.open 문서 .

Question 7

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

이 시도:

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

순수한 자바스크립트로,

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

Question 8

Steven Spielberg의 답변을 자세히 설명하기 위해 다음과 같은 경우에 이렇게 했습니다.

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

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

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

Question 9

나는 다음을 사용하고 아주 잘 작동합니다!

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

Question 10

나는 당신이 이것을 통제할 수 없다고 생각합니다. 사용자가 새 창에서 링크를 열도록 브라우저를 설정한 경우 새 탭에서 링크를 열도록 강제할 수 없습니다.

탭이 아닌 새 창에서 JavaScript 열기

Question 11

흥미로운 사실은 사용자가 작업을 호출하지 않았거나(버튼 등을 클릭하는 경우) 또는 비동기식인 경우 새 탭을 열 수 없다는 것입니다. 예를 들어 다음은 새 탭에서 열리지 않습니다.

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

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

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

Question 12

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

새창

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

새 탭

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

-- 또는 --

 var myWin = window.open(strUrl);

Question 13

function openTab(url) { const link = document.createElement('a'); link.href = url; link.target = '_blank'; document.body.appendChild(link); link.click(); link.remove(); }

Question 14

(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')))

Question 15

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

이 페이지에서 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>

Question 16

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

Question 17

새 탭에서 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(); }); });

Question 18

제이쿼리

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

JS

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

Question 19

또는 링크 요소를 만들고 클릭할 수 있습니다...

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

이것은 팝업 차단기에 의해 차단되어서는 안됩니다... 바라건대.

Question 20

이 질문에 대한 답은 아니오가 아닙니다.

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

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

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

2단계: 프로그래밍 방식으로 해당 링크를 클릭합니다.

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

자! 나를 위해 매력을 작동합니다.

Question 21

target="_blank"를 사용하지 마십시오.

제 경우에는 항상 해당 창에 특정 이름을 사용합니다. meaningfulName , 이 경우 프로세서 리소스를 절약합니다.

 button.addEventListener('click', () => { window.open('https://google.com', 'meaningfulName') })

이런 식으로 예를 들어 버튼을 10번 클릭하면 브라우저는 훨씬 더 많은 리소스를 소비하는 10개의 다른 탭에서 여는 대신 항상 하나의 새 탭에서 다시 렌더링합니다.

이에 대한 자세한 내용은 MDN 에서 읽을 수 있습니다.

Question 22

새 탭을 열고 같은 탭을 유지하는 방법에 대해 많은 정보를 조사했습니다. 나는 그것을 할 수있는 하나의 작은 트릭을 발견했습니다. 열어야 하는 url - 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;

Question 23

target 속성 값으로 _blank 를 사용 url 을 href 로 사용하여 display:hidden 스타일로 aa children 요소를 사용하여 <a> 그런 다음 DOM에 추가한 다음 자식 요소에서 클릭 이벤트를 트리거합니다.

업데이트

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

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

Question 24

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

예를 들어,

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

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

Question 25

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

 gBrowser.selectedTab = gBrowser.addTab("http://example.com");

Question 26

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

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

Question 27

이것은 나를 위해 작동합니다. 이벤트를 방지하고 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>

Question 28

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

다음은 작업 예입니다 (stackoverflow 스니펫은 새 탭을 열 수 없음)

Question 29

"_blank"를 대상으로 사용하도록 제안하는 답변 사본이 많이 있지만 이것이 작동하지 않는다는 것을 알았습니다. Prakash가 지적했듯이 브라우저에 달려 있습니다. 그러나 창에 위치 표시줄이 있어야 하는지 여부와 같이 브라우저에 특정 제안을 할 수 있습니다.

chrome에 대한 보다 구체적인 질문에 대한 Nico의 답변에 따라 "탭과 유사한 것" 을 충분히 제안하면 탭을 얻을 수 있습니다 .

 window.open('http://www.stackoverflow.com', '_blank', 'toolbar=yes, location=yes, status=yes, menubar=yes, scrollbars=yes');

면책 조항: 이것은 만병 통치약이 아닙니다. 그것은 여전히 사용자와 브라우저에 달려 있습니다. 이제 창 모양에 대한 기본 설정을 하나 더 지정했습니다.

Question 30

나는 다음과 같이 쓴 사람의 말에 어느 정도 동의할 것입니다. 기존 웹 페이지." 적어도 나에게 이 "일반 규칙"은 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 }

Question 31

외부 링크(다른 사이트로 연결되는 링크)만 열려면 다음과 같은 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'); } }); });

jQuery를 사용하여 드롭다운 목록(선택 상자)에서 선택한 텍스트 가져오기 (0)	2021.11.23
Python에서 문자열의 하위 문자열을 얻으려면 어떻게 해야 합니까? (0)	2021.11.19
GitHub의 README.md에 이미지를 추가하는 방법은 무엇입니까? (0)	2021.11.19
Git을 사용하여 원격 저장소에 태그를 푸시하는 방법은 무엇입니까? (0)	2021.11.19
CSS에서 여백과 패딩을 사용하는 경우 [닫힘] (0)	2021.11.19

No error , No gain

새 탭이 아닌 새 탭에서 URL 열기

중요 사항:

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

데모

인터넷 익스플로러 (11)

테스트 페이지

크롬은 어떻습니까? Internet Explorer(11) 및 Firefox(29)와 다르게 `window.open` 구현합니다.

요약

추가 읽기

새창

새 탭

이 질문에 대한 답은 아니오가 아닙니다.

업데이트

'etc. > StackOverFlow' 카테고리의 다른 글

'etc./StackOverFlow'의 다른글

티스토리툴바

새 탭이 아닌 새 탭에서 URL 열기

중요 사항:

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

데모

인터넷 익스플로러 (11)

테스트 페이지

크롬은 어떻습니까? Internet Explorer(11) 및 Firefox(29)와 다르게 window.open 구현합니다.

요약

추가 읽기

새창

새 탭

이 질문에 대한 답은 아니오가 아닙니다.

업데이트

'etc. > StackOverFlow' 카테고리의 다른 글

'etc./StackOverFlow'의 다른글

관련글

티스토리툴바

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

크롬은 어떻습니까? Internet Explorer(11) 및 Firefox(29)와 다르게 `window.open` 구현합니다.