0

先週コミュニティの助けを借りて、このコードをここに実装することに成功しました

今、私は似たようなことをする必要がありますが、html テキストを [タイトル] と比較します。これまでの私のコードは次のとおりです。

$(document).ready(function() {

 $(".views-field-field-success-stories-image-data .field-content").click(function() {
   var sharedata = $(this).text();
   $('#bannerContainer img[title = "'+sharedata+'" ]').addClass('selected');
 });
 $("#bannerContainer img").click(function() {
  if (
   $('#bannerContainer img').hasClass('selected', $('#bannerContainer img').removeClass('selected') ) );

 });
});


      <span class="field-content">The Grand Event Center</span>
      <span class="field-content">Choura Events Catering</span>
      <span class="field-content">El Dorado Park Golf Course</span>

<div id="bannerContainer">
 <img src="1.jpg" title="The Grand Event Center" class="selected">
 <img src="1.jpg" title="The Grand Event Center" class="selected"> 
 <img src="1.jpg" title="The Grand Event Center" class="selected">
</div>

<!--- My Goal
<div id="bannerContainer">
 <img src="1.jpg" title="The Grand Event Center" class="">
 <img src="1.jpg" title="The Grand Event Center" class=""> 
 <img src="1.jpg" title="The Grand Event Center" class="selected">
</div> ---->

なんらかの理由で、toggleClass に頭を悩ませています。

現在、スパンのいずれかをクリックすると、「選択した」ものがくっついて、別のスパンをクリックしても離れません。

私は何が欠けていますか？

前もって感謝します！

4

2 に答える 2

0

私は通常、クラスを現在の要素 (選択した要素) に追加する直前に、関連するすべての要素からクラスを削除するだけでこれを実現します。

$(document).ready(function() {
 $(".views-field-field-success-stories-image-data .field-content").click(function() {

   // Add this next line
   $("#bannerContainer img").removeClass("selected");

   var sharedata = $(this).text();
   $('#bannerContainer img[title = "'+sharedata+'" ]').addClass('selected');
 });
 $("#bannerContainer img").click(function() {
  if (
   $('#bannerContainer img').hasClass('selected', $('#bannerContainer     img').removeClass('selected') ) );
 });
});
于 2010-09-03T19:53:54.997 に答える
0

1つの要素に再度設定する前に、それを持つすべての要素から「選択された」クラスを削除するのはどうですか?

于 2010-09-03T19:54:17.983 に答える