백그라운드에서 새 탭을여시겠습니까?


79

자바 스크립트를 사용하여 다른 탭에서 새 페이지를 열고 싶지만 현재 탭에 초점을 맞추고 싶습니다. 다음과 같이 할 수 있습니다.

open('http://example.com/');
focus();

그러나 크롬에서이 작업을 수행하면 현재 탭으로 다시 전환하기 전에 잠시 새 탭이 깜박입니다. 나는 이것을 피하고 싶다.

이 애플리케이션은 개인 북마크릿이므로 최신 Chrome에서만 작동하면됩니다.



1
@ jolly.exe 감사합니다.하지만 크롬에서 새 페이지를 일시적으로 표시하는 것을 피하는 사람은 없습니다.
st-boost

3
이 질문이 중복 된 것 같습니다. stackoverflow.com/questions/6897430/… 해결책은 Chrome 확장 API를 사용하는 것입니다.
윌렘 스텐

@WillemJoosten 실제로 목표를 달성 한 첫 번째 답변에 감사드립니다. 그러나 확장 외부에서 이것을 수행하는 방법이 있습니까? 이점은 너무 작아서 확장 프로그램을 설치하는 데 걸리는 시간보다 큽니다.
st-boost

의 사용 가능한 복제 방지가 초점이 된 window.open
mariotomo

답변:


102

업데이트 : Google 크롬 41 버전에서는 initMouseEvent 동작이 변경된 것 같습니다.

이는 속성이 원하는대로 설정된 동적으로 생성 된 요소 에서 ctrl+ click(또는 배경 탭을 여는 다른 키 / 이벤트 조합)를 시뮬레이션하여 수행 할 수 있습니다.ahrefurl

실행 중 : 바이올린

function openNewBackgroundTab(){
    var a = document.createElement("a");
    a.href = "http://www.google.com/";
    var evt = document.createEvent("MouseEvents");
    //the tenth parameter of initMouseEvent sets ctrl key
    evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                                true, false, false, false, 0, null);
    a.dispatchEvent(evt);
}

크롬에서만 테스트


8
대단해, 우리가 얻은 것 같다. 그러나 중요한 참고 사항 : OSX에서는 true 여야하는 metaKey 값입니다.
st-boost

4
또 다른 참고 사항 :을 설정하지 않으면 앵커 텍스트가있는 URL에서는 작동하지 않습니다 a.target='_blank';.
st-boost

1
이것은 큰 도움이됩니다. 당신은 최고입니다 : D
iAnuj

25
이것은 Google Chrome 개발자 릴리스 41.0.2224.0, 2014-11-20 릴리스 (Linux에서 테스트 됨)에서 작동하지 않는 것 같습니다. 처음에는 "의도하지 않은 기능"이라고 생각했기 때문에 놀라운 일은 아니지만 로컬 응용 프로그램에서 많이 사용했기 때문에 성가신 일입니다. Chrome의 안정적인 베타 채널은 아직 영향을받지 않지만 곧 변경 사항을 병합 할 것입니다.
Daniel Andersson 2014

5
@ maggot092를 사용 MouseEvent('click', {view: window, ctrlKey: true, metaKey: true});하면 새로 열린 탭이 여전히 포커스를 훔칩니다. 내가 뭔가를 놓치고 있습니까?
Stepan Parunashvili

9

이 질문에 대한 THX! 모든 인기있는 브라우저에서 잘 작동합니다.

function openNewBackgroundTab(){
    var a = document.createElement("a");
    a.href = window.location.pathname;
    var evt = document.createEvent("MouseEvents");
    //the tenth parameter of initMouseEvent sets ctrl key
    evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                                true, false, false, false, 0, null);
    a.dispatchEvent(evt);
}

var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
if(!is_chrome)
{
    var url = window.location.pathname;
    var win = window.open(url, '_blank');
} else {
    openNewBackgroundTab();
}

3
MDN에서 "사용되지 않음이 기능은 웹 표준에서 제거되었습니다. 일부 브라우저에서 여전히 지원할 수 있지만 삭제 중입니다. 이전 또는 새 프로젝트에서 사용하지 마십시오.이 기능을 사용하는 페이지 또는 웹 앱이 중단 될 수 있습니다. 언제든지. "
BaSsGaz 2015 년

1

내가 기억하는 한 이것은 브라우저 설정에 의해 제어됩니다. 즉, 사용자는 백그라운드 또는 포 그라운드에서 새 탭을 열지 여부를 선택할 수 있습니다. 또한 새 팝업이 새 탭에서 열릴 지 아니면 그냥 ... 팝업을 열지 선택할 수 있습니다.

예를 들어 파이어 폭스 환경 설정에서 :

Firefox 설정 예

마지막 옵션을 확인하십시오.


3
감사합니다. 다른 웹 사이트에 영향을주지 않도록 웹 사이트 내에서 제어 할 수있는 기능을 원합니다. (또한 ctrl / cmd + 클릭은 동일한 작업을 수행합니다. 항상 사용합니다.)
st-boost

1
이것은 자바 스크립트가 아니라 브라우저 설정에만 해당됩니다.
Lin

0

나는 당신이 찾고있는 것을 아주 간단한 방법으로 정확하게했습니다. Chrome과 Opera에서는 완벽하게 부드러 우며 Firefox와 Safari에서는 거의 완벽합니다. IE에서 테스트되지 않았습니다.


function newTab(url)
{
    var tab=window.open("");
    tab.document.write("<!DOCTYPE html><html>"+document.getElementsByTagName("html")[0].innerHTML+"</html>");
    tab.document.close();
    window.location.href=url;
}

바이올린 : http://jsfiddle.net/tFCnA/show/

설명 :
창 A1과 B1과 웹 사이트 A2와 B2가 있다고 가정 해 보겠습니다.
B1에서 B2를 연 다음 A1로 돌아가는 대신 A1에서 B2를 열고 B1에서 A2를 다시 엽니 다.
(작동하게 만드는 또 다른 점은 사용자가 A2를 다시 다운로드하도록 만들지 않는다는 것입니다. 4 행 참조)


당신이 유일하게 할 수있다는 하지 않습니다 같은 새 탭은 메인 페이지 전에 열립니다이다.


1
감사합니다. 그것은 현명한 접근 방식입니다. 그러나 이벤트 리스너를 막고, 브라우저 기록을 잘못 정렬하고, doctype을 잠재적으로 변경하고, html 요소의 속성을 버리는 등 많은 문제가 있습니다. 실제로 "다른 페이지에서 새 페이지를 열지 않는다"는 사실은 말할 것도 없습니다. 탭".
st-boost

다른 탭에서 새 페이지가 열리지 않는 이유는 무엇입니까?
Mageek

4
기술적으로 동일한 탭에서 새 페이지를 열고 새 탭에서 동일한 페이지를 엽니 다. 나는 그것이 중요하지 않은 문법 일 뿐이라는 것을 알고 있습니다. 중요한 것은 페이지를 히스토리에서 분리하고 (뒤로 버튼이 끊어짐) 크롬 등이 탭 계층 구조를 추적하는 것을 훨씬 더 어렵게 만든다는 것입니다.
st-boost

-3

다음은 포커스가있는 새 탭에서 유효한 URL을 탐색하는 완전한 예입니다.

HTML :

<div class="panel">
  <p>
    Enter Url: 
    <input type="text" id="txturl" name="txturl" size="30" class="weburl" />
    &nbsp;&nbsp;    
    <input type="button" id="btnopen"  value="Open Url in New Tab" onclick="openURL();"/>
  </p>
</div>

CSS :

.panel{
  font-size:14px;
}
.panel input{
  border:1px solid #333;
}

자바 스크립트 :

function isValidURL(url) {
    var RegExp = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/;

    if (RegExp.test(url)) {
        return true;
    } else {
        return false;
    }
}

function openURL() {
    var url = document.getElementById("txturl").value.trim();
    if (isValidURL(url)) {
        var myWindow = window.open(url, '_blank');
        myWindow.focus();
        document.getElementById("txturl").value = '';
    } else {
        alert("Please enter valid URL..!");
        return false;
    }
}

또한 http://codebins.com/codes/home/4ldqpbw 의 솔루션으로 저장소를 만들었습니다 .


2
감사합니다. 제 질문을 오해하신 것 같습니다. 나는 오프너 페이지가 새 탭이 아닌 마지막에 초점을 맞춘 페이지가되기를 원합니다. 문제는 새 탭을 잠시 동안 표시하지 않을 수있는 방법입니다.
st-boost

오늘과 최신 Chrome에서는 전혀 작동하지 않는 것 같습니다.
Mr Printer
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.