0

FirefoxでGreasemonkeyを使用して最初のユーザースクリプトを書き込もうとしています。私はuserscriptsとjQueryに慣れていないので、かなりの調査を行いましたが、この単純なテストスクリプトを機能させることができないようです。これまでのところ、私はこれをTest.user.jsファイルに持っています：

// ==UserScript 
// @name            Desk Notifications 
// @description     Displays special notifications to NVOWS coaches at desk.com
// @downloadURL     http://www.example.com/deskNotifications.user.js
// @include         http://nvows.desk.com/agent
// @namespace       http://www.example.com/userscripts
// @updateURL       http://www.example.com/deskNotifications.meta.js
// @version         0.1
// @grant           none
// ==/UserScript 

$(document).ready(function(){ 
    alert('Script loaded.'); 
    $('.interaction_type_60').click(function() { 
        alert("You clicked a case!"); 
    }); 
    $('.interaction_type_40').click(function() { 
        alert("You clicked a case!"); 
    }); 
});


私がそれをする必要があるのは明らかにもっと複雑ですが、私はjQueryとuserscriptsに慣れていないので、最初にこれを機能させたかっただけです。これまでのところ、「スクリプトがロードされました」。考えられる多くの問題を除外するために表示されています。ファイアバグでコードのこの部分だけを実行すると、正常に動作します。

$(document).ready(function(){ 
    alert('Script loaded.'); 
    $('.interaction_type_60').click(function() { 
        alert("You clicked a case!"); 
    }); 
    $('.interaction_type_40').click(function() { 
        alert("You clicked a case!"); 
    }); 
});

そのため、コードエラーが発生したり、間違ったクラスセレクターを取得したりすることはありません。コードが正しく実行されている場合、何が問題になる可能性があるのか​​わかりません。誰かが助けることができればそれは大いにありがたいです。私はプログラミングの初心者ではありません。ただウェブベースのもの。

これは、クリックされたときに表示しようとしているHTMLページの一部です。

<tbody id="ticket_filter_list_items" class=" ">
<tr id="ticket_filter_item_73354627" class="ticket_filter_item ticket_filter_item_table_view interaction_type_60 ticket_filter_item_open ticket_filter_item_current_selected" onclick=" ticketEditTableView(73354627, event);return false; " data-in-search="" data-ticket-id="73354627" style="">
<tr id="ticket_filter_item_73382205" class="ticket_filter_item ticket_filter_item_table_view interaction_type_40 ticket_filter_item_open " onclick=" ticketEditTableView(73382205, event);return false; " data-in-search="" data-ticket-id="73382205" style="">
</tbody>



これは話題から外れていて大したことではありませんが、「http://nvows.desk.com/agent」ではないページでこのユーザースクリプトを実行させる何かを見つけたら、私に知らせてください。「スクリプトが読み込まれました」と表示されます。StackOverflowに行くたびに。ハ。

--------------------------------------

更新：テストのためにこれを実行しようとしました：

$(document)
.on('click', this, function(){
    alert('Please Work!!!!');
})

この間ずっとクリックしようとしていたのは、メッセージが表示されていないものです。ページが読み込まれた後、それらすべてにjavascriptが読み込まれます。私はほとんどポジティブです。それが彼らが私がそれらをクリックすることを許可しない理由です。これらのアイテムをクリックする方法はありますか？HTMLスクリプトでは、他の要素と同じように見えます。

4

2 に答える 2

3

あなたはfirebugコンソールでコードを実行したと言います、そしてそれはうまく働きます、それはここにほとんどオプションを残しません。これらのイベントを追加しようとしているHTMLタグは、まだ作成されていないと思います。これは、これらの要素がJavaScriptを介して作成され、それらを作成するコードがまだ実行されていない場合に発生します。もう1つの可能性は、要素がDOMにあるが、それらのクラスをまだ受け取っていないことです。これは、クラスがJavaScriptを使用して指定されている場合にも発生する可能性があります。

このコードサンプルを試してみて、役立つかどうかを確認してください（結果を教えてください）。

$(document).ready(function(){ 
    alert('Script loaded.'); 
    $(document)
        .on('click', '.interaction_type_60', function() { 
            alert("You clicked a case!"); 
        })
        .on('click', '.interaction_type_40', function() { 
            alert("You clicked a case!"); 
        }); 
});

注意：これらのイベントをアタッチしようとしている要素は、元のコードの実行時にDOMに存在する必要があり、定義したクラスが含まれている必要があります。私のコードは、イベントをドキュメント要素にアタッチし、要素のチェーンをバブリングするクリックイベントを探します。これにより、これらのセレクターを含む新しい要素を追加でき、イベントハンドラーをにアタッチしなくてもリスナーが呼び出されます。それらの要素。

PS

この特定のケースでは、パーツも必要ありません$(document).ready(..)。あなたはただ使うことができます：

$(document)
    .on('click', '.interaction_type_60', function() { 
        alert("You clicked a case!"); 
    })
    .on('click', '.interaction_type_40', function() { 
        alert("You clicked a case!"); 
    });

イベントは常に存在するドキュメント要素に添付されているためです。

編集：マークアップを見た後、問題はインラインonclickイベントが使用されていることでもあると思いますreturn false;。これにより、イベントがチェーンのさらに上でバブリングするのを妨げている可能性があります。

于 2012-11-14T19:41:43.503 に答える
1

あなたが言うには、.click()Firebugから元のコードを実行すると、それは機能します。

iMosesが指摘したように、ページのjavascriptがターゲットノードを作成する前にスクリプトが起動するため、Greasemonkeyスクリプトからは機能しません。

.on()また、スクリプトまたはFirebugのどちらからもコードが機能しないことを報告します。これはonclick、ターゲットノード（ticketEditTableView()）の機能がイベントのバブリングを停止していることを意味します。おそらく呼び出しますevent.stopPropagation()。

解決策は、に戻って.click()、ターゲットノードがページに追加されたときにそれを適用することです。これは、waitForKeyElements（）ユーティリティを使用して実行できます。

これらのノードがページに追加されるときにそれらのノードにバインドするために使用する完全なスクリプトを次に示します。waitForKeyElements.click()

// ==UserScript
// @name        Desk Notifications
// @description Displays special notifications to NVOWS coaches at desk.com
// @downloadURL http://www.example.com/deskNotifications.user.js
// @include     http://nvows.desk.com/agent
// @namespace   http://www.example.com/userscripts
// @updateURL   http://www.example.com/deskNotifications.meta.js
// @version     0.1
// @require     http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @require     https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant       GM_addStyle
// ==/UserScript==
/*- The @grant GM_addStyle directive is needed to work around a design change
    introduced in GM 1.0.   It restores the sandbox.
*/

waitForKeyElements (
    ".interaction_type_60, .interaction_type_40", addAlertOnClick
);

function addAlertOnClick (jNode) {
    jNode.click (alertOnClick);
}

function alertOnClick (zEvent) {
    var targNode    = $(zEvent.currentTarget);
    var messageStr  = "Oopsie!";

    if (targNode.hasClass ("interaction_type_60") ) {
        messageStr  = "You clicked a type 60 case!"
    }
    else if (targNode.hasClass ("interaction_type_40") ) {
        messageStr  = "You clicked a type 40 case!"
    }

    alert (messageStr);
}
于 2012-11-15T09:59:16.997 に答える