JSは関数がonclickイベントとして実行されないようにします

Question

特定の関数をonclickイベントとして実行しないようにしたいと思います。

<a href="#" onclick="myfunc1();myfunc2();"></a> 

ここでは、myfunc1ではなくmyfunc1を無効にしたいと思います。実際に私はページ全体からmyfunc1を無効にしたいと思いますが、とにかくこれが私が必要とする唯一のものです。

私はページを制御できません。これを達成するためにuserscriptやその他のスクリプト注入ツールを使用しています。

私が試した何

：

1. をページが読み込まれた後の関数を再定義：私は、関数（）{myfunc1 =機能（）{}でDOMContentLoadedイベントにイベントリスナを追加しようとしました; } これは動作しているようですが、高速インターネット接続を備えた高速コンピュータでは、myfunc1が定義される前に（同期的にロードされる外部jsファイルで）実行されることがあります。 myfunc1が定義された後に関数が実行されることを保証できる方法はありますか？

2. myclunc1をその名前で削除するためにonclickイベントを「乗っ取る」方法はありますか？

Answer 1

あなたは、イベントリスナーを使用する必要があり、その後、あなたはremoveEventListenerと1を削除することができるだろう。

function myfunc1() { 
 
    console.log('myfunc1'); 
 
} 
 
function myfunc2() { 
 
    console.log('myfunc2'); 
 
} 
 
var a = document.querySelector('a[onclick="myfunc1();myfunc2();"]'); 
 
var myfunc1_; 
 
a.parentNode.addEventListener('click', function(e) { // Hijack 
 
    if(a.contains(e.target)) { 
 
    myfunc1_ = window.myfunc1; 
 
    window.myfunc1 = function(){}; 
 
    } 
 
}, true); 
 
a.addEventListener('click', function(e) { // Restore 
 
    window.myfunc1 = myfunc1_; 
 
    myfunc1_ = undefined; 
 
});

<a href="#" onclick="myfunc1();myfunc2();">Click me</a>

：あなたがHTMLソースを変更できない場合は、あなたが代わりにイベントハンドラの機能をハイジャック好むかもしれない

function myfunc1() { 
 
    console.log('myfunc1'); 
 
} 
 
function myfunc2() { 
 
    console.log('myfunc2'); 
 
} 
 
var a = document.querySelector('a[onclick="myfunc1();myfunc2();"]'); 
 
a.setAttribute('onclick', 'myfunc2();');

<a href="#" onclick="myfunc1();myfunc2();">Click me</a>

など汚れたものが必要になります

Answer 2

もう1つの方法は、Jqueryを使用してtを設定することです彼はヌルにアンカータグでプロパティをonlick onlick。次に、myfunc2（）だけでクリック機能をアタッチすることができます。

$(document).ready(function() { 
    $("a").prop("onclick", null); 
    $("a").click(function(){ 
     myfunc2(); 
    }); 
}); 
function myfunc1() { 
    console.log('1'); 
} 
function myfunc2() { 
    console.log('2'); 
} 

<a class="test" href="#" onclick="myfunc1();myfunc2();">Example</a> 

あなたはここにcodepen見ることができます -

Answer 3

http://codepen.io/anon/pen/BLBYpOはおそらく、あなたはjQueryのにしています。変数$btnでfuncOne()が含まれているのonclick属性を持つすべてのボタン要素を取得します

$(document).ready(function(){ 
    var $btn = $('button[onclick*="funcOne()"]'); 

    $btn.each(function(){ 
     var newBtnClickAttr; 
     var $this = $(this); 
     var btnClickAttr = $this.attr("onclick"); 

     newBtnClickAttr = btnClickAttr.replace(/funcOne\(\)\;/g, ""); 

     $this.attr("onclick", newBtnClickAttr); 
    }); 
}); 

。

あなたの場合、これは属性で削除したい機能です（例：myfunc1();）。

これで、そのonclick関数ですべての要素が選択されました。 それらをループし、現在の属性値を取得し、関数名を空の文字列に置き換えて削除します。

これで、置き換えた関数名が含まれていない値が得られました。onclick属性値をnewBtnClickAttrの値で更新できるようになりました。

これをチェックするSample Fiddle