首页 > 其他分享 >edge扩展开发-页面间的通信

edge扩展开发-页面间的通信

时间:2023-03-10 23:11:06浏览次数:48  
标签:function chrome button 扩展 tabs edge sendMessage test 页面

1. popup.html

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script src="js/jquery.min.js"></script>
        <script src="js/popup.js"></script>
    </head>
    <body>
        <input id="test_button" type="button" value="测试">
    </body>
</html>

2. popup.js

$(document).ready(function(){
    $("input[id='test_button']").click(function(){
        chrome.tabs.getSelected(null, function(tab) {
            chrome.tabs.sendMessage(tab.id, {greeting: "test_button"}, function(response) {
                console.log(response);
            })
        });
    });
});

3.content.js

$(document).ready(function(){
    chrome.extension.onMessage.addListener(function(request, sender, sendMessage) {
        if (request.greeting == "test_button") {
            alert('hello world');
            sendMessage('hello world');
        }
    });
});

标签:function,chrome,button,扩展,tabs,edge,sendMessage,test,页面
From: https://www.cnblogs.com/wstong2052/p/17204820.html

相关文章