1

次のような要素があります。

<div class="button 17-facebook-dashboard-check">Elem1<div>
<div class="button 18-google-dashboard-check">Elem2<div>
<div class="button 19-twitter-dashboard-check">Elem3<div>
<div class="button">Elem4<div>

およびハンドラー:

$('.button').click(function () { });

このハンドラー内で、 で終了するクラスを持つ要素に対して NN や SOCIAL を推定するなど、いくつかの特別な操作を行う必要があります-dashboard-check

たとえば、Elem4 をクリックしても何も起こらないはずです。Elem1 をクリックすると、17 と facebook を出力する必要があります。どちらも 2 つの変数で区別されます。

jqueryでこれを行うための速い方法は何ですか? 正規表現?.HasClass で終わる?

4

7 に答える 7

4

HTML を制御できると仮定すると、HTMLdata-属性を使用してこの情報を以下に埋め込む方がはるかに望ましいでしょう。

<div class="button" data-id="17" data-service="facebook">Elem1</div>
<div class="button" data-id="18" data-service="google">Elem2</div>
<div class="button" data-id="19" data-service="twitter">Elem3</div>
<div class="button">Elem4</div>

必要な要素でのみ機能するセレクターを非常に簡単に作成できるようになりました。

$('.button[data-id][data-service]').click(...);

また、クリックするだけで必要な情報を簡単に取得できます。

$('.button[data-id][data-service]').click(function() {
    alert($(this).attr("data-id"));           // with jQuery
    alert(this.getAttribute("data-service")); // without jQuery
});
于 2013-09-25T10:11:42.723 に答える
2

セレクターで終了を使用

    $( "div[class$='-dashboard-check']" ).each(function( index ) {
       console.log( index + ": " + $( this ).attr("id") );
    });
于 2013-09-25T10:05:25.763 に答える
0
 <div class="button 17-facebook-dashboard-check">Elem1</div>
 <div class="button 18-google-dashboard-check">Elem2</div>
 <div class="button 19-twitter-dashboard-check">Elem3</div>
 <div class="button">Elem4</div>

これを試して:

 $( "div[class$='-dashboard-check']" ).click(function (e) {
    var o = $(e.target)
    var str = o.attr('class');
    var s1 = str.substring(7,9);
    var s2 = str.substr(10,str.indexOf('-'));
    alert(s1+" "+s2);
  });
于 2013-09-25T10:37:15.087 に答える
0

属性セレクター endwith を使用してみてください。

$("[attribute$='value']")

すなわち

$("[class$='-dashboard-check']")
于 2013-09-25T10:06:58.690 に答える
0

あなたが必要*=

説明:指定された部分文字列を含む値を持つ指定された属性を持つ要素を選択します。

試す:

$( "div[class*='-dashboard-check']" )

$= チェック文字列の末尾
*= チェック文字列の内容

ここに属性セレクターの完全なリストがあります

于 2013-09-25T10:07:04.917 に答える
0

[attribute$=value] CSS セレクターを使用できます: http://www.w3schools.com/cssref/sel_attr_end.asp。のようなもの:[class$=endVal]

于 2013-09-25T10:08:16.410 に答える