オンクリックでケーススイッチ

Question

私は実際に同じことをしているクリックイベントをいくつか持っています。誰かが私に、これを行うためにケーススイッチを使うべきだと言いました。私は自分のコードを減らすことができます。しかし、私はクリックイベントと組み合わせてそれを行う方法を知らない。

$("#wishlist_top").on("click", function() { 
    window.hj=window.hj||function(){(hj.q=hj.q||[]).push(arguments)}; 
    hj('tagRecording', ['Klikt op "wishlist" in menu']); 
}); 

$(".wishlist").on("click", function() { 
    window.hj=window.hj||function(){(hj.q=hj.q||[]).push(arguments)}; 
    hj('tagRecording', ['Klikt op "plaats op wishlist"']); 
}); 

$(".product_size").on("click", function() { 
    window.hj=window.hj||function(){(hj.q=hj.q||[]).push(arguments)}; 
    hj('tagRecording', ['Klikt op "maat advies"']); 
}); 

$(".product_stock").on("click", function() { 
    window.hj=window.hj||function(){(hj.q=hj.q||[]).push(arguments)}; 
    hj('tagRecording', ['Klikt op "maat niet beschikbaar?"']); 
}); 

if ($('*').hasClass('404')) { 
    window.hj=window.hj||function(){(hj.q=hj.q||[]).push(arguments)}; 
    hj('tagRecording', ['Klant is op een 404 pagina gekomen']); 
} 

ありがとうございます！

Answer 1

あなたはこのためswitch/caseを使用することができますが、それは最高のアイデアではないかもしれません。あなたはまだ各クラス/ IDのclickイベントを聞く必要があるので、私は関数を作り、特定の文字列で呼び出すでしょう。だから、あなたのコードを変更したい次回

$("#wishlist_top").on("click", 
    function() { tagRecording('Klikt op "wishlist" in menu'); }); 

：

function tagRecording(value) { 
    window.hj=window.hj||function(){(hj.q=hj.q||[]).push(arguments)}; 
    hj('tagRecording', [value]); 
} 

今ちょうどそうのようなclickリスナーを使用しますので、は次のように上からあなたのコードを使用して

、あなたは機能を作ることができますtagRecording関数を変更するだけです（名前は自由に変更できます）。

Answer 2

ここでもう一つのオプションは、あなたのマークアップでデータ属性を使用することです。

$(".product_stock").on("click", function() { 
    window.hj=window.hj||function(){(hj.q=hj.q||[]).push(arguments)}; 
    hj('tagRecording', $(this).data("text")); 
}); 

：あなたのデータ属性からテキストをつかみ、あなたは1つのJS・ハンドラを設定することができます

<a href="#" class="product_stock" data-text='Klikt op "wishlist" in menu'>Foo</a> 

そして、 - あなたはあなたの要素のそれぞれにおけるdata-text属性に渡したいメッセージを追加します。もちろん、これはマークアップの作成を制御できる場合にのみ機能します。