5

前の人生で、私はこのようなことをしたかもしれません:

<a href="#" onclick="f(311);return false;">Click</a><br/>
<a href="#" onclick="f(412);return false;">Click</a><br/>
<a href="#" onclick="f(583);return false;">Click</a><br/>
<a href="#" onclick="f(624);return false;">Click</a><br/>

jQueryを使用すると、次のようなことができます。

<a class="clicker" alt="311">Click</a><br/>
<a class="clicker" alt="412">Click</a><br/>
<a class="clicker" alt="583">Click</a><br/>
<a class="clicker" alt="624">Click</a><br/>

<script language="javascript" type="text/javascript">
    $(".clicker").bind("click", function(e) {
        e.preventDefault();
        f($(this).attr("alt"));
    });
</script>

alt属性を使用してDOMからjQueryにデータを渡すことは、意図された目的ではないため、ハックのように感じることを除いて。jQueryがアクセスするためにDOMにデータを保存/非表示にするためのここでのベストプラクティスは何ですか?

4

4 に答える 4

4

「clicker-123」のようなid属性を使用して、数値を解析することができます。私は通常それを行うか、「rel」属性を使用します。

したがって、本質的に、私が知っているそれを行うためのより良い方法はありません。このスレッドが私が間違っていることを証明することを願っています。

于 2008-12-12T22:47:52.630 に答える
4

HTML5 の新機能であるdata-...-attribute を使用することをお勧めします。

HTML コードは次のようになります。

<a class="clicker" data-mynumber="311">Click</a>

その後el.attr('data-mynumber')、データを取得するために使用できます。

マイナンバーの代わりに、任意の名前を選択できます。

これはすべてのブラウザで機能します。

于 2010-04-25T19:32:10.373 に答える
3

JQuery.dataを使用すると、辞書をDOM要素に関連付けることができます。このデータはjQueryを介して設定できます。

<a class="clicker">Click</a><br/>
<a class="clicker">Click</a><br/>
<a class="clicker">Click</a><br/>
<a class="clicker">Click</a><br/>

<script language="javascript" type="text/javascript">
    var values = new Array("311", "412", "583", "624");
    $(".clicker").each(function(i, e) {
       $(this).data('value', values[i]).click(function(e) { 
         f($(this).data('value'));
       });
    });
</script>

または(jQuery 1.4.3以降)HTML5以外のドキュメントでも機能するHTML5データ属性を使用します。

<a class="clicker" data-value="311">Click</a><br/>
<a class="clicker" data-value="412">Click</a><br/>
<a class="clicker" data-value="583">Click</a><br/>
<a class="clicker" data-value="624">Click</a><br/>

<script language="javascript" type="text/javascript">
    $(".clicker").click(function(e) { 
       f($(this).data('value'));
    });
</script>
于 2008-12-12T23:09:30.963 に答える
1

申し訳ありませんが、すでにaltタグを入力している場合は、onclickハンドラーのjQueryへの割り当てを遅らせることで実際に何かが得られるかどうかわかりません。これは「ハンマーを持っているので、すべての問題が釘のように見える」というだけの場合ではありません。jqueryメソッドは、アクションがコンテンツから自然に派生できるデータ(クラス定義、タグタイプなど)よりも余分なデータに依存しない場合に最適に使用されると思います。

于 2008-12-12T23:14:01.953 に答える