0

2つの質問があります：

1）htmlの内容は似たような構造で、クラスタイトルの内容が違うだけです。$（div .title：contains（ "cat"））も$（div .title）.text（）= "cat"）を使ってみました

2）$（div a）の内容が必要なものであることを確認するだけで、アコーディオンのインデックスを取得するにはどうすればよいですか。$（div a）.text（）=="猫"を使ってみました

ここでコードを確認してください：

HTML1の内容

    <div class="mod moduleselected" id="mod969">
    <div class="content module moduleselect">
    <div class="hd" ><div class="inner">
    <div class="title">cat</div>
    <ul class="terminallist"></ul>
    <ul class="buttons">
    <li class="help"></li>
    <li class="show" ></li>
    </ul>
    </div>
    </div>
    </div>

    <div class="mod moduleselected" id="mod969">
    <div class="content module moduleselect">
    <div class="hd" ><div class="inner">
    <div class="title">rat</div>
    <ul class="terminallist"></ul>
    <ul class="buttons">
    <li class="help"></li>
    <li class="show" ></li>
    </ul>
    </div>
    </div>
    </div>

<div class="mod moduleselected" id="mod969">
    <div class="content module moduleselect">
    <div class="hd" ><div class="inner">
    <div class="title">dog</div>
    <ul class="terminallist"></ul>
    <ul class="buttons">
    <li class="help"></li>
    <li class="show" ></li>
    </ul>
    </div>
    </div>
    </div>

アコーディオン

        <div id="dia">
        <div id="dialog" title="Detailed FeedBack ">
        <div id="accordion">
        <h3><a href="#">dog</a></h3>
        <h3><a href="#">cat</a></h3>
        <h3><a href="#">rat</a></h3>
        </div>
        </div>
        </div>

Javascript

        $('div .title').mouseover(function() {
    if($("div a").text().indexOf("cat")!=-1)
    {
    $("#accordion").accordion("activate", 1);
    }
    $('div .title').mouseleave(function(){$("#accordion").accordion("activate", -1); });
        });

これが私がこのjavascriptコードでやろうとしていることです。猫の中身にマウスを合わせると、猫の中身のアコーディオンが開きます。そして、アコーディオンの選択を閉じるためにそれを離れるとき。

マウスをhtmlコンテンツのcat、ratに合わせると。それらのコンテンツのアコーディオンボタンを並べて開く必要があります。例:(htmlコンテンツの）ラットにカーソルを合わせると、アコーディオンラットが開いている（またはアクティブである、つまりコンテンツが表示されている）ことがわかります。

4

2 に答える 2

1

次のように簡潔にする必要があります（マイナーな調整が行われる可能性があります）。

$('.content .title').hover(function(e){
    var index = this.textContent.split(/\W/)[1] - 1;    
    $("#accordion").accordion('activate', index);
});
​

この正規表現は、例の場合は数値である最後の「単語」を取得するだけであるため、HTMLに注意してください。1を引くと、ゼロベースのインデックスが得られます。要素にさらにテキストを追加すると、それは壊れます。

参照： http： //jsfiddle.net/35yGV/

于 2012-08-01T13:56:01.933 に答える
1

更新（デモを参照）

次のようなものが必要なようです。コンテンツセクションにカーソルを合わせたら、そのセクションのタイトルを見つけ、そのテキストを<a>アコーディオンの要素のテキストと照合して、そのセクションをアクティブにします。

$(function() {
    $("#accordion").accordion();

    var links = $('#accordion a').map(function() {
        return $(this).text().trim().toLowerCase();
    }).toArray();

    $('div.content').mouseover(function() {
        var title = $(this).find('div.title').text().toLowerCase();
        var index = links.indexOf(title);
        if (index != -1) {
            $("#accordion").accordion("activate", index);
        }
    });
});​

PS jQueryには.hover()、このためのメソッドもあります。

于 2012-08-01T06:16:14.707 に答える