0

商品リストの生成中に実際に div id の問題に直面しています。テキストリンクにフェードイン効果と非表示効果を使用しています

コードの一部を次に示します。

JavaScript

$('.theLink').hover(
    function () {
        $('.theDiv').fadeIn();
    },
    function () {
        $('.theDiv').hide();
    });

CSS

.theDiv {
    display: none;
    margin-top:-7px;
    background-color:#fff;
    width: 148px;
    line-height:100%;
    border:1px solid #c3c3c3;
    background:#fff;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    position: relative;
    padding: 10px;
}

html

<div class="theLink">Compatibilit&agrave;</div>    
<div class="theDiv">' . $something . '</div>

variabile$somethingは正しく機能し、製品の各アイテムの正しい詳細をリストに表示します。リストに移動すると、現在のアイテムだけではなく、リストの各アイテムtheLinkが開きます。theDiv

明確になったことを願っています。助けてくれてありがとう。

追加した：

部品がどこに配置されているかを理解できるように、実装されたコードを追加します

<div class="content">
    <div class="bordobasso">
        <div class="theLink">
            <div class="compatibilita">Compatibilit&agrave;</div>
        </div>
        <div class="dettagliprodotto">Acquista</div>
    </div>
</div><div class="theDiv">' . $new_products['products_id'] . '</div>

contentリストからアイテムを展開し、いくつかのcssを配置するための別のjquery関数がすでにあります

4

2 に答える 2

1

これをテストします：

$('.theLink').hover(
    function () {
        $(this).closest('.content').next('.theDiv').fadeIn();
    },
    function () {
        $(this).closest('.content').next('.theDiv').hide();
});

「this」変数は、jquery が「theDiv」要素を探す要素を示します

例: http://jsfiddle.net/k5hs8/

于 2013-03-19T16:32:43.960 に答える
0

私はこれを提案します：

$('.theLink').hover(
    function () {
        $('.theDiv', $(this).parent()).fadeIn();
    },
    function () {
        $('.theDiv', $(this).parent()).hide();
});

このhtmlで：

<div>
<div class="theLink">Compatibilit&agrave;</div>    
<div class="theDiv">' . $something . '</div>
</div>
于 2013-03-19T16:34:54.843 に答える