0

だから私は今、多くの問題を抱えています。プロジェクトを 3 日で完了しなければならず、Chrome 拡張機能のリンクで立ち往生しています。

計画：

現在のタブで使用可能なすべての画像を表示し、いくつかのソーシャル ネットワークで共有する Google Chrome 拡張機能。

これで、私の拡張機能は現在のタブから絶対パスまたは動的パスのすべての画像を取得し、それらを popup.html に表示します。リンク先のウェブサイトの画像の右側に Facebook のロゴを含む画像を追加する必要があります。 sharer.php

angular.jsフレームワークを使用しています。私のファイル:

Popup.html - これは画像を表示する div です。

 <script src="js/lib/jquery-1.8.2.min.js"></script>
    <script src="js/lib/angular.min.js"></script>

    <script src="js/app/app.js"></script>
    <script src="js/app/popup.js"></script>
    <script src="js/app/bindclick.js"></script>
 <div ng-controller="PageController">
            <div>{{message}}</div>
            <h2>Page:</h2>
            <div>{{title}}</div>
            <div id="url">{{url}}</div>
            <h2>Has Links:</h2>
            <ul>
                <li ng-repeat="pageInfo in pageInfos">
                    <div><img src={{pageInfo}} class="imagemPopup"/><img src="http://formaemflor.com.br/loja/skin/frontend/default/perfume/images/facebook_icon.png" class="fblink" style="width: 50px; height: 50px"/></a></div>
                </li>                       
            </ul>
        </div>

content.js

//alert('content script loaded');

chrome.extension.onMessage.addListener(
function (request, sender, sendResponse) {

    if (request.action == 'PageInfo') {
        var pageInfos = [];

        $('img').each(function() {
            pageInfos.push($(this)[0].src);
        });
        sendResponse(pageInfos);
    }
});

popup.js

myApp.service('pageInfoService', function() {
    this.getInfo = function(callback) {
        var model = {};

        chrome.tabs.query({'active': true},
        function (tabs) {
            if (tabs.length > 0)
            {
                model.title = tabs[0].title;
                model.url = tabs[0].url;

                chrome.tabs.sendMessage(tabs[0].id, { 'action': 'PageInfo' }, function (response) {

                    model.pageInfos = response;

                    callback(model);
                });
            }

        });
    };
});

myApp.controller("PageController", function ($scope, pageInfoService) {

    pageInfoService.getInfo(function (info) {           
        $scope.title = info.title;
        $scope.url = info.url;
        $scope.pageInfos = info.pageInfos;

        $scope.$apply();


    });
});

イベントハンドラーを bindclick.js に適用したいのですが、次のようなものにする必要があります。

document.getElementById('.fblink').addEventHandler('click', function(){
 var url='http://www.facebook.com/sharer/sharer.php?u='+pageInfo.url;
 chrome.tabs.create({ url: url });
});

あらゆることを試しましたが、onclick イベントを機能させることができません。コードを教えてもらえますか? Chrome拡張機能を理解している人の助けが本当に必要です。可能であればSkypeを追加してください。beirao94ですばやく学ぶことができます

4

2 に答える 2

1

方觉の言うことに従って、私はあなたと解決策を共有するようになりました.

angularjs には ng-click という関数があるので、私たちがしているのは popup.html です。

<img src="http://formaemflor.com.br/loja/skin/frontend/default/perfume/images/facebook_icon.png" class="fblink" ng-click"sharefb(pageInfo)"/>

コントローラー内の popup.js で

 $scope.sharefb = function($url){
         chrome.window.create({url: 'http://www.facebook.com/sharer/sharer.php?u='+$url}); // or
         chrome.tabs.create({url: 'http://www.facebook.com/sharer/sharer.php?u='+$url)];
};

そのため、マニフェスト v2 を使用しても、html コードで JavaScript 関数を簡単に呼び出すことができます。

于 2013-07-22T20:06:18.140 に答える