1

これらすべてに不慣れで、ここで検索しても、まだ私の髪を引っ張っています. 優しくしてください。私は Andy Langton の show hide アコーディオンを使用しています。これは、IE 8 を除くすべてのブラウザーで素晴らしく機能します (以前のバージョンを想定しています)。トグル リンクは同じままです。ここで同様の問題を読んで、jsのバージョン番号をjquery/1.3.2からjquery/1.8.3に変更しました。これにより、「隠しテキスト」が表示されますが、トグルリンクは変更されず、「続きを読む」のままです「隠す」と言うべきとき。

私は問題が解決されたので正しい軌道に乗っていると仮定しています（別の問題が発生しますが）。

Javascript

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js" type="text/javascript"></script>
<script>
$(document).ready(function () {
    var showText = 'Leer M&aacute;s'; //Read more
    var hideText = 'Ocultar'; //Hide
    var is_visible = false;
    $('.toggle').prev().append(' (<a href="#" class="toggleLink">' + showText + '</a>)');
    $('.toggle').hide();
    $('a.toggleLink').click(function () {
        $(this).toggleClass('visible');
        $(this).html(($(this).hasClass('.visible')) ? hideText : showText);
        $(this).parent().next('.toggle').toggle('slow');
        return false;
    });
});
</script>

HTML

...
<a href="#" class="toggleLink"></a>
<span class="toggle"><br>
<span class= "ticktext"><span>
...
4

2 に答える 2

2

あなたのエラーはここにあります

$(this).html(($(this).hasClass('.visible')) // <-- extra .

あなたが欲しいのは

$(this).html(($(this).hasClass('visible'))

あなたがのクラスを持っていない限り

class='.visible'

これを切り替えているため、そうではありません$(this).toggleClass('visible');。

class='visible'

他のブラウザで動作するので意味がないと思いますが？

続きを読むにとどまる理由を説明しています..これは常にfalseと評価されるため、showTextは常に表示されます

$(this).hasClass('.visible')) ? hideText : showText
于 2013-03-22T18:16:47.517 に答える
0

jquery 1.8 を使用しているonため、動的に追加された要素には委任されたイベントを使用する必要があります

$(document).on('click','a.toggleLink',function() {
    $(this).toggleClass('visible');
    $(this).html( ($(this).hasClass('.visible')) ? hideText : showText);
    $(this).parent().next('.toggle').toggle('slow');
    return false;
});
于 2013-03-22T18:03:28.270 に答える