0

もう一つの初心者の質問...

スクリプト (以下) は、ある div で選択されたテキストを別の div のターゲット テキストと比較し、2 番目の div の親にスタイルを適用します。スクリプトを文字通りに変更する必要があります。「A が選択されている場合は、A を探す」ではありません。むしろ、「Apples が選択されている場合は、A を探してください。」

では、jQuery に 2 つの異なるテキスト文字列を同じものとして認識させるにはどうすればよいでしょうか。「var A = 'Apples', B = 'Bravo' [etc] ;」を試してみましたが、#menutable div にカーソルを合わせると、クラスが .embox に追加されます。

HTML:

    <div id="maintable">
     <div class="embox">
      content
      <div class="options">A,B,C</div>
     </div>
     <div class="embox">
      content
      <div class="options">B,F</div>
     </div>
     <!-- and about a hundred more just like these -->
    </div>

    <div id="menutable">
     <div class="optionA">Apples</div>
     <div class="optionB">Bravo</div>
     <div class="optionC">Comp</div>
     <div class="optionF">Ferengi</div>
    </div>

現在のスクリプト (動作しません):

$('#menutable div').hover(function() {
    var that = this, A = "Apples", B = "Bravo", C = "Comp", F = "Ferengi";
    $('#maintable .options').filter(function() {
        return $(this).text().indexOf($(that).text()) === -1;
    }).closest(".embox").addClass("bgtransp");
},
function() {
    $(".embox").removeClass("bgtransp");
});
4

3 に答える 3

1

jQueryのinArray（）メソッドを使用して、値が定義した値の配列内にあるかどうかを確認できます。

例：

$.inArray($(this).html(), ['Apples', 'A', 'Orange']);

コードで、関数が-1より大きい値を返すかどうかを確認します。詳細については、上記のリンク先のjQueryドキュメントをご覧ください。

于 2011-08-09T18:42:14.213 に答える
0

データ属性を使用する

HTML

div id="menutable">
 <div class="option" data-letter="A">Apples</div>
 <div class="option" data-letter="B">Bravo</div>
 <div class="option" data-letter="C">Comp</div>
 <div class="option" data-letter="D">Ferengi</div>
</div>

JS

$('#menutable div').hover(function() {
    var that = this;
    $('#maintable .options').filter(function() {
        return $(this).text().indexOf($(that).data('letter')) === -1;
        //seems to be !== -1 
    }).closest(".embox").addClass("bgtransp");
},
function() {
    $(".embox").removeClass("bgtransp");
});

また、文字列を使用して最初の文字を取得できますstringname[0]

于 2011-08-09T18:40:15.647 に答える
0

HTML5 data-* を使用したくない場合は、使用できます

var myArray = ['Apples', 'A', 'Orange'];
var i=0;
$("#menutable > .option").each(
   function(){
     $(this).data("myOption",myArray[i]);
     i++;
});

を使用してデータを取得できます

$('#menutable > .option').click(function() {
   var myOption = $(this).data("myOption");
}

注: :)menu-tableの代わりにid を設定するほうが Web 標準です。menutable

于 2011-08-09T20:37:46.357 に答える