Program

iOS7のブックマークレットでwindow.open()を使うと挙動がおかしい

こんばんは、ころすけ(@wg_koro)です。

私のiPhoneはiOS7(7.0.2)にしているのですが、こいつのSafariで変な挙動を発見。

ブックマークレットでwindow.open()すると、オープンしたページがアクティブにならない。

ただのタップだと大丈夫

下記のようなページを用意して、Aリンクをタップする。実際のデモページ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Window openテスト</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=yes,maximum-scale=2.0">
    <script type='text/javascript'>
        function open_window(){
            window.open('./opened.html');
        }
    </script>

    <style type='text/css'>
        #open {
            display : block;
            text-align  : center;
            border  : 1px solid red;
            width   : 100px;
            height  : 40px;
            padding : 20px 0;
            background-color: red;
            color           : #fff;
            text-decoration : none;
        }
    </style>
</head>
<body>

    <a href='javascript:open_window();' id='open'>開く</a>

</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>Window openテスト</title>

function open_window(){

window.open('./opened.html');

}

</script>

#open {

display : block;

text-align : center;

border : 1px solid red;

width : 100px;

height : 40px;

padding : 20px 0;

background-color: red;

color : #fff;

text-decoration : none;

}

</style>

</head>

<body>

</body>

</html>

タップすれば、「Opened!」と書かれたページがフォアグラウンドで開く。これは期待した動作で問題なし。

ブックマークレットだとアカン

次に、下記のようなjavascriptをブックマークレットで実行する。

javascript:(function(){window.open('http://zafiel.wingall.com/data/windowopen_test/opened.html')})()

1	javascript:(function(){window.open('http://zafiel.wingall.com/data/windowopen_test/opened.html')})()

ブックマークレット登録ページ
※一度上記ページをブックマーク登録して、ブックマーク編集からURLを編集。URLの「javascript」より前の文字を削除するとブックマークレットとして使えます

そうすると「開く」ボタンがあるページはそのまま。画面に変化なし。その代わり、バックグラウンドで「Opened」ページが開かれている。なので、一見何も動作していないように見えてしまう。

本来は「Opened!」の画面が表示されなければならないはず。…Safariのバグだよなぁ。

ブックマークレットを使って様々なページをWebサービスに登録しているのですが、最近うまく動かない。なんだ？と思ったらこんなオチでした。iOS7のSafariは色々変なバグがあって本当困ります…。

2013年10月07日｜ Posted in Program ｜ 2 Comments »　

＜ Pythonのurllib2を使ってcookieつきでWebページを取得する配色に困ったらこれを使え！配色を助けてくれるPalettaがステキ＞

コメント2件

neran より:

2013/12/13 11:18

私も自前のオンラインブックマークなどブックマークレットから利用していたので、困っていましたが、以下の方法で、この問題はひとまず解消できるようです。

1．ブックマークレットの登録先を「お気に入り」または自分で設定しているお気に入りフォルダにする
2．動作させたいページでアドレスバーをタップし、表示されたブックマークレットを実行

この場合は、window.openしたページにフォーカスされます。

wg koro より:

2013/12/13 23:08

おおお、こんな手があったのか！これだと問題なくフォーカスされますね。
これまで微妙に不便で困ってたんですが、大変助かりました！ありがとうございます！！

コメントを残すコメントをキャンセル

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。