hrefの取得とクリックの変更

Question

イメージギャラリーに一連のリンクが設定されており、ユーザーに色を表示する方法が必要です。現在、色の名前は、ギャラリーの画像へのリンクのhrefタイトルに格納されています。この場合

<div class="select-option swatch-wrapper selected" data-attribute="pa_luxcraft-2" data-value="redblack"> 
<a href="#" style="width:32px;height:32px;" title="Red/Black" class="swatch-anchor"><img src="/ay/wp-content/uploads/2017/01/Center-Table-Red-Black-32x32.jpg" alt="thumbnail" class="wp-post-image swatch-photopa_luxcraft-2_ swatch-img" width="32" height="32" data-pin-nopin="true"></a> 
</div> 

それは画像をクリックするたびに、それが

を「選択」のクラスが割り当てられます色

のための赤/黒である私は私がタイトルを得ることができます知っています単純変数

var title = $(this).attr('title'); 

しかし、私は選択されたクラスが適用されたときにどのように取得するのかは分かりません。

Answer 1

始めに役立ついくつかの例が含まれています。

<div class="displayToUser"></div> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script> 

$("a").click (function() { 
    $(document).css("background",$(this).attr("title")); //set's background to color, just to let you know how to do that. 
    $(this).attr("title","new title"); //changes title if that's what you want 
    $(".displayToUser").html(
     $(this).attr("title") 
    ); // sets an element to show the contents of title, just so that you know how to do that 
    $(this).hasClass("selected"); //if you want to check to see if it has the class selected 
    $(this).addClass("selected"); //to add the class selected, if that's what you're looking for. 
}); 

</script> 

Answer 2

var color; 

if ($(this).hasClass('selected')) { 
    color = $(this).attr('title'); 
} 

and so on... 

Answer 3

var valueoftitle = $('.selected')[<your_index>].attr('title'); 

編集：

$('.selected')であなたが戻って.selectedクラスを持つすべての要素を持つ配列を取得します。次に、アクセスしたい要素のインデックスを持つ大括弧でこれらの要素にアクセスできます。その後、要素があり、この例のように何でもできます。.attr('title')、属性 'title'の値を戻します。これは、forループ、foreachループ、またはインラインでのインデックスのように可能な限り使用できます。

Answer 4

画像をクリックしたときに選択したクラスが適用されていると述べました。イメージにリンクされたクリックハンドラがあると仮定すると、親リンクからtitle属性を取得することができます。