iPhone Safari 웹 앱이 새 창에서 링크를 엽니다.
홈 스크린에 아이콘을 추가한 후 웹에 문제가 있습니다.홈 스크린에서 웹을 시작하면 모든 링크가 Safari의 새 창에서 열립니다(전체 화면 기능이 손실됩니다).어떻게 예방할 수 있습니까?저는 아무런 도움도 찾을 수 없었고, 단지 같은 대답이 없는 질문만 했습니다.
iWebKit 프레임워크에서 JavaScript 솔루션을 찾았습니다.
var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++)
{
a[i].onclick=function()
{
window.location=this.getAttribute("href");
return false
}
}
여기에 있는 다른 솔루션은 외부 링크(Safari에서 외부로 열려는 링크)를 고려하지 않거나 도메인이 없는 상대 링크를 고려하지 않습니다.
html5 모바일 템플릿 프로젝트는 https://gist.github.com/1042026 이라는 주제에 대한 좋은 토론을 가진 이 요지에 연결됩니다.
그들이 생각해 낸 최종 코드는 다음과 같습니다.
<script>(function(a,b,c){if(c in b&&b[c]){var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone")</script>
jQuery를 사용하는 경우 다음 작업을 수행할 수 있습니다.
$("a").click(function (event) {
event.preventDefault();
window.location = $(this).attr("href");
});
이것은 iOS 6.1 및 부트스트랩 JS 링크(즉, 드롭다운 메뉴 등)에서 작동합니다.
$(document).ready(function(){
if (("standalone" in window.navigator) && window.navigator.standalone) {
// For iOS Apps
$('a').on('click', function(e){
e.preventDefault();
var new_location = $(this).attr('href');
if (new_location != undefined && new_location.substr(0, 1) != '#' && $(this).attr('data-method') == undefined){
window.location = new_location;
}
});
}
});
이것은 오래된 질문이고 여기에 있는 많은 솔루션들은 자바스크립트를 사용하고 있습니다.그 이후로 iOS 11.3이 출시되었고 이제 스코프 멤버를 사용할 수 있습니다.범위 구성원은 다음과 같은 URL입니다."/"
여기서 해당 범위 아래의 모든 경로는 새 페이지를 열지 않습니다.
범위 구성원은 이 웹 응용 프로그램의 응용 프로그램 컨텍스트 탐색 범위를 나타내는 문자열입니다.
다음은 제 예입니다.
{
"name": "Test",
"short_name": "Test",
"lang": "en-US",
"start_url": "/",
"scope": "/",
...
}
여러분은 또한 여기에서 그것에 대해 더 많이 읽을 수 있습니다.또한 이 기능을 제공하는 제너레이터를 사용하는 것이 좋습니다.
범위를 지정하면 Android와 비슷하게 모든 것이 예상대로 작동하며, 범위를 벗어난 대상은 PWA에 대한 뒤로 버튼(상태 표시줄의 작은 버튼)이 있는 Safari에서 열립니다.
Davids의 답변과 Richards의 의견에 따라 도메인 검사를 수행해야 합니다.그렇지 않으면 다른 웹 사이트에 대한 링크도 웹 앱에 열립니다.
$('a').live('click', function (event)
{
var href = $(this).attr("href");
if (href.indexOf(location.hostname) > -1)
{
event.preventDefault();
window.location = href;
}
});
jQuery Mobile을 사용하는 경우 data-message='false' 특성을 사용할 때 새 창이 나타납니다.실제로 $.mobile.ajaxEnabled 설정 또는 target=' 특성을 사용하여 agaxEnabled를 해제할 때마다 agaxEnabled가 해제됩니다.
다음을 사용하여 수정할 수 있습니다.
$("a[data-ajax='false']").live("click", function(event){
if (this.href) {
event.preventDefault();
location.href=this.href;
return false;
}
});
(라이브() 방법에 대한 Richard Pool 덕분에 - bind()와 함께 작동하지 않았습니다.)
agaxEnabled를 전체적으로 해제한 경우 [data-proxy='false']를 삭제해야 합니다.
이것이 jQuery Mobile 고유의 문제일 것으로 예상했기 때문에 이해하는 데 다소 시간이 걸렸습니다. 실제로 새 창을 금지한 것은 Ajax 링크였습니다.
이 코드는 iOS 5에서 작동합니다(저에게는 작동했습니다).
머리글 태그:
<script type="text/javascript">
function OpenLink(theLink){
window.location.href = theLink.href;
}
</script>
동일한 창에서 열려는 링크에서 다음을 수행합니다.
<a href="(your website here)" onclick="OpenLink(this); return false"> Link </a>
나는 이 댓글에서 이 코드를 얻었습니다: 아이폰 웹 앱 메타 태그.
대상이 명시적으로 "_blank"로 설정되어 있는 경우에도 새 창에서 링크를 열 수 있도록 허용해야 할 수 있습니다.
$('a').live('click', function (event)
{
var href = $(this).attr("href");
// prevent internal links (href.indexOf...) to open in safari if target
// is not explicitly set_blank, doesn't break href="#" links
if (href.indexOf(location.hostname) > -1 && href != "#" && $(this).attr("target") != "_blank")
{
event.preventDefault();
window.location = href;
}
});
독립 실행형 WebApp에서만 실행되는지 확인하고 jQuery 없이 작동하며 iOS 8.2에서 테스트한 것처럼 간단하기 때문에 매우 완전하고 효율적인 것을 찾았습니다.
독립 실행형 유지:Mobile Safari를 여는 독립 실행형 웹 앱의 링크 방지
또한 링크는 거의 정상적으로 수행할 수 있습니다.
<a href="#" onclick="window.location='URL_TO_GO';">TEXT OF THE LINK</a>
해시 태그와 href를 제거할 수 있습니다. 이 태그가 수행하는 모든 작업이 모양에 영향을 미칩니다.
이것이 iOS 6에서 저에게 효과가 있었던 것입니다(마셔의 답변을 아주 약간 각색).
<script>
(function(document,navigator,standalone) {
if (standalone in navigator && navigator[standalone]) {
var curnode,location=document.location,stop=/^(a|html)$/i;
document.addEventListener("click", function(e) {
curnode=e.target;
while (!stop.test(curnode.nodeName)) {
curnode=curnode.parentNode;
}
if ("href" in curnode && (curnode.href.indexOf("http") || ~curnode.href.indexOf(location.host)) && curnode.target == false) {
e.preventDefault();
location.href=curnode.href
}
},false);
}
})(document,window.navigator,"standalone")
</script>
이것은 뒤로 버튼을 막던 션의 약간 변형된 버전입니다.
// this function makes anchor tags work properly on an iphone
$(document).ready(function(){
if (("standalone" in window.navigator) && window.navigator.standalone) {
// For iOS Apps
$("a").on("click", function(e){
var new_location = $(this).attr("href");
if (new_location != undefined && new_location.substr(0, 1) != "#" && new_location!='' && $(this).attr("data-method") == undefined){
e.preventDefault();
window.location = new_location;
}
});
}
});
Twitter 부트스트랩 및 레일 3이 있는 사용자용
$('a').live('click', function (event) {
if(!($(this).attr('data-method')=='delete')){
var href = $(this).attr("href");
event.preventDefault();
window.location = href;
}
});
링크 삭제는 여전히 이 방식으로 작동합니다.
나는 독립 실행형 웹 앱 모드에서 대상="_blank"가 있는 링크를 제외한 모든 링크를 여는 것을 선호합니다.물론 jQuery를 사용합니다.
$(document).on('click', 'a', function(e) {
if ($(this).attr('target') !== '_blank') {
e.preventDefault();
window.location = $(this).attr('href');
}
});
iOS 웹 앱에서 사용한 한 가지 해결 방법은 모든 링크(CSS에 의한 단추) 양식 제출 단추를 만드는 것이었습니다.그래서 저는 목적지 링크에 게시된 양식을 열고 type="http"를 입력했습니다. 가장 좋은 방법은 아니지만, 이것이 제가 이 페이지를 찾기 전에 알아낸 것입니다.
저는 여기에서 찾을 수 있는 @rmarsher의 답변으로 샤워기 설치 가능 패키지를 만들었습니다.
http://github.com/stylr/iosweblinks
다음을 사용하여 아래와 같이 쉽게 스니펫을 설치할 수 있습니다.bower install --save iosweblinks
를 사용하는 사용자용JQuery Mobile
위의 솔루션 구분 팝업 대화 상자.이렇게 하면 웹 앱 내에서 링크가 유지되고 팝업이 허용됩니다.
$(document).on('click','a', function (event) {
if($(this).attr('href').indexOf('#') == 0) {
return true;
}
event.preventDefault();
window.location = $(this).attr('href');
});
또한 다음과 같은 방법으로 수행할 수도 있습니다.
$(document).on('click','a', function (event){
if($(this).attr('data-rel') == 'popup'){
return true;
}
event.preventDefault();
window.location = $(this).attr('href');
});
페이지의 모든 링크에 사용할 내용은 다음과 같습니다.
document.body.addEventListener(function(event) {
if (event.target.href && event.target.target != "_blank") {
event.preventDefault();
window.location = this.href;
}
});
jQuery 또는 Zepto를 사용하는 경우...
$("body").on("click", "a", function(event) {
event.target.target != "_blank" && (window.location = event.target.href);
});
이 메타 태그를 간단히 제거할 수 있습니다.
<meta name="apple-mobile-web-app-capable" content="yes">
언급URL : https://stackoverflow.com/questions/2898740/iphone-safari-web-app-opens-links-in-new-window
'programing' 카테고리의 다른 글
아랍어 문자가 포함된 CSV 파일이 Excel에서 기호로 표시됩니다. (0) | 2023.07.05 |
---|---|
메이븐의 "maven find symbol" 오류 (0) | 2023.07.05 |
Angular 8에서 API 응답으로 엑셀 파일을 다운로드하는 방법 (0) | 2023.07.05 |
Mac을 소유하지 않고 iOS 앱을 구축하시겠습니까? (0) | 2023.07.05 |
Docker와 Python virtualenv의 차이점은 무엇입니까? (0) | 2023.07.05 |