讓jQuery和GM_addStyle在基於工作Greasemonkey腳本的Chrome用戶腳本中工作

Question

我編寫了一個簡單的Greasemonkey script，用於放大懸停彈出窗口中的縮略圖。它使用了很多jQuery。它在Firefox上運行得很好。但不支持Chrome，因爲它不支持@require。

這個事情我遇到了solution。但是，即使在我將其與解決方案代碼集成之後，該腳本仍然無法在Chrome上運行。我只是把我所有的腳本代碼放在解決方案代碼的主要功能中。

它錯了嗎？如果有人能指出問題的出在哪裏，我能做些什麼才能解決問題，非常感謝。

function addJQuery(callback) { 
    var script = document.createElement("script"); 
    script.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"); 
    script.addEventListener('load', function() { 
    var script = document.createElement("script"); 
    script.textContent = "(" + callback.toString() + ")();"; 
    document.body.appendChild(script); 
    }, false); 
    document.body.appendChild(script); 
} 

function main() 
{ 
    $("body").append ('<div id="idLargePicturePopupWindow"><img></div>'); 

$('#idLargePicturePopupWindow').bind 
(
    "mouseenter mouseleave", 
    {bInPopup: true}, 
    myImageHover 
); 

$('#profPhotos .profPhotoLink > img').bind 
(
    "mouseenter mouseleave", 
    {bInPopup: false}, 
    myImageHover 
); 

function myImageHover (zEvent) 
{ 
    if (zEvent.type == 'mouseenter') 
    { 

     if (! zEvent.data.bInPopup) 
     { 

      var imgurl = this.src.toString(); 
      var bigimg = imgurl.replace(/\/thumbs\/[0-9x]+\//i, "/photos/"); 

      $("#idLargePicturePopupWindow img").attr ('src', bigimg); 
     } 

     $("#idLargePicturePopupWindow").show(); 
    } 
    else 
    { 
     $("#idLargePicturePopupWindow").hide(); 
    } 
} 

GM_addStyle ((<><![CDATA[ 
    #idLargePicturePopupWindow 
    { 
     position:    absolute; 
     background:    white; 
     border:     none; 
     margin:     1ex; 
     opacity:    1.0; 
     z-index:    1222; 
     min-height:    100px; 
     min-width:    200px; 
     padding:    0; 
     display:    none; 
     top:     2em; 
     left:     50em; 
    } 
    #idLargePicturePopupWindow img 
    { 
     margin:     0; 
     margin-bottom:   -4px; 
     padding:    0; 
    } 
]]></>).toString()); 
} 

addJQuery(main); 

Answer 1

兩個主要問題和1 可能問題：

1）不要包裝GM_addStyle()的main()函數內。 GM_addStyle()只適用於腳本範圍，它不會工作注入目標頁面（這是業務所做的main()和addJQuery()）。

2）當前的代碼使用E4X將多行字符串發送到GM_addStyle()，但Chrome不支持E4X。

唉，the multiline string hack that Chrome does support (for now)在Firefox中不起作用。

這意味着如果您希望支持這兩種瀏覽器，那麼使用GM_addStyle()編碼逼真的樣式會稍微困難一些。使用多轉義字符（\）像這樣：

GM_addStyle ("         \ 
    #idLargePicturePopupWindow {    \ 
     position:    absolute;  \ 
     background:    white;   \ 
     border:     none;   \ 
     margin:     1ex;   \ 
     opacity:    1.0;   \ 
     z-index:    1222;   \ 
     min-height:    100px;   \ 
     min-width:    200px;   \ 
     padding:    0;    \ 
     display:    none;   \ 
     top:     2em;   \ 
     left:     50em;   \ 
    }           \ 
    #idLargePicturePopupWindow img {   \ 
     margin:     0;    \ 
     margin-bottom:   -4px;   \ 
     padding:    0;    \ 
    }           \ 
"); 

¿3）addJQuery()特定版本可能並不總是可行的（競爭狀態）。讓我知道如果它不。

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.