0

私のHTMLは次のとおりです。

<div class="row side cards-row-1 cards-row">
    <a href="#" class="card cards-front"> Text </a>
</div>

<div class="row side cards-row-2 cards-row">
    <a href="#" class="card cards-front"> Text </a>
</div>

<div class="row side cards-row-3 cards-row">
    <a href="#" class="card cards-front"> Text </a>
</div>

ユーザーがリンクをクリックしたときに、cards-row の数値を取得する必要があります。

これを行う最善の方法は、Jquery の親セレクターとワイルドカードセレクターを使用することだと思いました。

これは私のJqueryコードです:

(function($) {
    $(document).ready(function() {
        "use strict";
        $('.cards-front').click(function(e) {
            e.preventDefault();
            $('.cards-row').removeClass('cards-expand');
            var classes = $(this).parent().attr("[class^=card-row-]");
            alert(classes);
            $(this).parent().addClass('cards-expand');
            $(this).insertAfter('<div class="cards-shadow"></div>');
        });

        $('.cards-back .close').click(function() {
            $('.cards-row').removeClass('cards-expand');
            $('.cards-shadow').remove();
        });

    });

})(jQuery);

alert classesキャプチャされた番号を確認するために使用しています。ただし、値をキャプチャする代わりに、単に言うだけですundefined

ここに JS Fiddle があります。

何が間違っているのかわかりません。何かポインタをいただければ幸いです。ありがとう！

4

3 に答える 3

2

セレクターが間違っています。クラス名を取得したい場合は、次のことを行う必要があります。

var classes = $(this).parent().attr("class");

文字ではなく数字だけを取得したい場合は、次のcards-row-正規表現を使用できます。

var classes = $(this).parent().attr("class").match(/cards-row-(\d+)/);

しかし、実際には、次の場合にindex()を使用できます。

var classes = $(this).parent().index() + 1;

値は 0 ベースなのでindex()、正しい値を得るには 1 ずつ増やす必要があります

更新されたフィドル

于 2013-04-27T10:55:54.730 に答える
1 
var classes = $(this).parent().attr("class").
        match(/cards-row-(\d)/)[1];

編集されたフィドルを参照してください。

于 2013-04-27T10:56:53.250 に答える
0

もっと簡単な方法は、文字を取り除き、数字だけを残すことです

var classes = $(this).parent().attr('class').match(/\d+/g);
于 2013-04-27T10:57:51.333 に答える