4

作業しているアクティブな要素に現在4つの特定のクラスのいずれかがあるかどうかを確認するために複数回実行する方法があるかどうかを調べようとして.hasClass()います。また、要素がこれを行うための最も最適化された方法を見つけようとしています。トリガー(またはアクティブな要素)として機能している(s)には、主にスタイリングの目的で複数のクラスがあります。

HTMLの例:

<div class="form_row">
    <div class="primary_row">1</div>
</div>
<div class="form_row">
    <div class="primary_row subexists">1</div>
    <div class="primary_row_sub">1a</div>
</div>
<div class="form_row">
    <div class="primary_row subexists">1</div>
    <div class="primary_row_sub subexists">1a</div>
    <div class="secondary_row">2</div>
</div>
<div class="form_row">
    <div class="primary_row subexists">1</div>
    <div class="primary_row_sub subexists">1a</div>
    <div class="secondary_row subexists">2</div>
    <div class="secondary_row_sub">2a</div>
</div>

私は現在それを構築しているところなので、これはまだ大まかなドラフトですが、必要に応じてさまざまな要素にさらに多くのクラスが存在すると想定しても安全です。私が心配している4つの主要なクラスはですprimary_row, primary_row_sub, secondary_row, secondary_row_sub。私は次のようなクリックハンドラーを構築しています:

$('.form_row > div').click(function()
{
   //code
});

このクリックハンドラーでは、クリックされた要素が上記の4つのうちの1つであるかどうかを検出できるようにしたいと思います。もしそうなら、私はそれに基づいて何かをしたいです。したがって、タイプごとに1つずつ4つのクリックハンドラーを作成するのではなく、クリックされた要素のクラスを決定します。私はそれを最適化して単一のハンドラーに封じ込めることができることを望んでいます。何か案は?

4

2 に答える 2

1

1つのオプション:

var classMap = {"one": function () { alert("one");}, 
                "two": function () { alert("two");},
                "three": function () { alert("three");} 
               }
,   classes = "";

$('div').click(function (e) {
    classes = this.className.split(" ");
    for (key in classMap) {
        if ($.inArray(key, classes) !== -1) {
            classMap[key]();
        }   
    }
});

http://jsfiddle.net/wp9X7/5/

于 2013-03-26T20:17:56.520 に答える
0
if ($(this).is(".primary_row")) {
    ...
} elseif ($(this).is(".primary_row_sub")) {
    ...
} and so on
于 2013-03-26T20:04:04.650 に答える