切换/滑动展开工作，但崩溃不与HTML箭头工作

Toggle/Slide expand works, but collapse does not work with HTML Arrow.

本文关键字：工作 崩溃 HTML 切换      更新时间：2023-09-26

我希望使用HTML实体(箭头)作为切换触发器来滑动/切换div。所有工作正常，除了当div展开时，向上的箭头不会切换内容。

这里是一个演示小提琴:http://jsfiddle.net/8tkmW/-展开工作，崩溃不。
(不知道↑是否可以放入)

任何帮助，感谢。

你应该使用一个类，当框被折叠或展开时，你可以切换这个类。在下面的例子中，我一直在使用collapsed类。

这是一个Demo 

var collapsedSize = '40px';
$('.content').each(function() {
    var h = this.scrollHeight;
    console.log(h);
    var div = $(this);
    if (h > 30) {
        div.css('height', collapsedSize);
        div.after('<a class="arrow-link collapsed" href="#">&#8595;</a><br/>');
        var link = div.next();
        link.click(function(e) {
            e.stopPropagation();
            if (link.hasClass('collapsed')) {
                link.html('&#8593;');
                div.animate({
                    'height': h
                });
                link.removeClass('collapsed')
            } else {
                div.animate({
                    'height': collapsedSize
                });
                link.addClass('collapsed')
                link.html('&#8595;');
            }
        });
    }
});
相关文章：