2

助けてくれてありがとう..ここに私の問題があります: 以下のコードは、[続きを読む...] リンクをクリックすると、リンクの下に div が表示されるはずですが、他のすべての可能な div が非表示になった後にのみ...そのままコールバックで使用しますが、そのように使用すると、最初のリンクが正しく表示され、最後の 3 つが表示され、次に非表示になり、次に表示されます...助けてください!

Javascript:

var more_text="Read More...";
var less_text="Read Less...";

jQuery(document).ready(function() {
    $j(".dropdown").click( function () {
        if ($j(this).html() == more_text){
            var that = $j(this);
            $j(".extra").slideUp( function () {
                $j(".dropdown").html(more_text);
                that.html(less_text);
                that.next(".extra").slideDown();
            });
        }
    });
});

HTML:

<div class="dropdown">Read More...</div>
<div class="extra" style="display: none;">Here is more text!!</div>

<div class="dropdown">Read More...</div>
<div class="extra" style="display: none;">Here is more text!!</div>

<div class="dropdown">Read More...</div>
<div class="extra" style="display: none;">Here is more text!!</div>

<div class="dropdown">Read More...</div>
<div class="extra" style="display: none;">Here is more text!!</div>
4

2 に答える 2

1

問題は、$j(".extra").slideUp(...クラスでいくつかの要素を呼び出すとextra、すでに非表示になっているため、コールバックがすぐに起動し、閉じる必要がある要素が閉じられると、コールバックが再び起動されることです。その行を次のように変更します。

$j(".extra").slideUp().promise().done( function () {

そして、期待どおりに機能すると思います。

于 2012-07-26T22:29:00.810 に答える
0

上にスライドするには、要素をフィルタリングする必要があります。これを使用する必要があります:

jQuery(document).ready(function() {
    $j = jQuery;
    $j(".dropdown").click( function () {
        if ($j(this).html() == more_text){
            var that = $j(this);
            if ($j(".extra").filter(":visible").length > 0) {
                $j(".extra").filter(":visible").slideUp( function () {
                    $j(".dropdown").html(more_text);
                    that.html(less_text);
                    that.next(".extra").slideDown();
                });
            }
            else {
                $j(".dropdown").html(more_text);
                that.html(less_text);
                that.next(".extra").slideDown();
            }
        }
    });
});

これには、要素が表示されているかどうかをチェックする条件もあり、.extra表示されていない場合は要素をスライドさせません。

http://jsfiddle.net/vExYL/

于 2012-07-26T22:29:32.550 に答える