Chrome拡張機能 - ポップアップをクリックするとポップアップが表示されるのはなぜですか？

Chromeの拡張機能を試していて、ポップアップウィンドウが奇妙な動作をしていました。Chrome拡張機能 - ポップアップをクリックするとポップアップが表示されるのはなぜですか？

popup.htmlは1つの要素<a id="grantexpert">...</a>であり、popup.jsではこの要素の背景色を変更したいと思います。色の変更は、ドキュメントの準備ができた直後に変更されたときに機能します。しかし、クリックイベントでは、クリックすると色が非常に短時間（まばたき）変化し、すぐに元の設定に戻ります。ポップアップウィンドウがクリックイベントの後に再び読み込まれるようです。

マニフェスト：

"browser_action": { 
    "default_popup": "popup/popup.html" 
    },

popup.html：

<!DOCTYPE html> 
    <head> 
    <script src='../other/jquery-3.1.1.min.js'></script> 
    <script src='popup.js'></script> 
    </head> 

    <body style="width:250px;"> 

    <a class="testitem" href id="grantexpert">grantexpert.sk</a> 

    </body> 
</html>

popup.js：

(function($) { 

    $(document).ready(function() { 

    //$("#grantexpert").css('font-size', '28px'); - this works 

    // this does not work 
    $('#grantexpert').click(function() { 
     $(this).css('font-size', '28px'); 
    }); 

    }); 

})(jQuery);

なぜ要素はありません点滅の色を変更しますが、クリックした後に調整されたプロパティを保持せずに戻します。

出典

2016-12-20 Incredible

はaにhref空を削除してください：

<a class="testitem" href id="grantexpert">grantexpert.sk</a>

へ：

<a class="testitem" id="grantexpert">grantexpert.sk</a>

出典

2016-12-20 16:26:44 Syden

これはうまくいきましたが、その理由はわかりません。 – Incredible

'href'がポップアップをリフレッシュしていました。 – Syden

このリンクをクリックするとページをリロードします。リンク

<a href="javascript:;" ...

または他のようにそれを取り除くにNOPを追加

<a href ...

試みは、これは、同様の質問 Is an empty href valid? とWhich "href" value should I use for JavaScript links, "#" or "javascript:void(0)"?

出典

2016-12-20 16:27:38 corn3lius

削除され

<a ...

を提案しますhrefタグから。 hrefがポップアップのURLを変更し、ポップアップが更新されます。それを削除することにより、クリック時のURLは変更されません。

出典

2016-12-20 16:30:50 xagos

私は同様のことを経験しました。ポップアップに次のような単純なボタンがある場合：

<button id="myButton">My Button</button>

クリックするとポップアップがリロードされます。この現象を回避するには、デフォルトイベントが発生しないようにする必要があります。たとえば、jQueryの場合：

$("#myButton").click(function(event){ 
    event.preventDefault(); // needed to prevent the popup from being reloaded 
    // do something here 
    showMessage("My Button has been clicked"); 
});

出典

2018-03-07 04:44:35

Chrome拡張機能 - ポップアップをクリックするとポップアップが表示されるのはなぜですか？

答えて

関連する問題