1

我不是 jQuery 专家，我想做的就是替换我单击的第一个元素，该元素.arrow具有不同内容的类，然后在再次单击时再次返回原始内容，同时让最近的li标签展开和折叠我已经想通了。

重要我的类有多个元素，.arrow我只希望点击的.arrow类受到影响。

感谢所有的帮助。

$(document).ready(function() {
    $('.arrow').click(function(){
        $(this).closest('li').find('ol:first').fadeToggle('slow', 'linear');
        // prevent default action
        return false;       
    }); 
});
4

2 回答 2

1 
$('.arrow').click(function(){
    $(this).text(function(_,txt) {
        return txt === 'Show' ? 'Hide' : 'Show';
    })
    $(this).closest('li').find('ol:first').fadeToggle('slow', 'linear');
    // prevent default action
    return false;       
});

出于本示例的目的，我只是将文本从show/hide.

如果内容是动态的，那么我更喜欢使用 HTML-5 data-* 属性来存储必须显示的文本。

检查小提琴

于 2013-08-06T00:16:07.503 回答
0

假设您的.arrow元素可能包含的不仅仅是纯文本，并且在任何时候最多有 1 个.arrow元素被换出：

var swapbuffer = <alternative_content>; // html fragment
//...

$('.arrow').click( function (eve) {
    var temp_html = swapbuffer;

    temp_html = swapbuffer;
    swapbuffer = $(this).html();
    $(this).html(temp_html);
    $(this).closest('li').find('ol:first').fadeToggle('slow', 'linear');

    // prevent default action
    eve.preventDefault;
    return false;       
});

您尚未指定“.arrow单击的第一个元素”的意思-您是指将事件分派到的第一个（代码用于此场景），还是单击的元素之后的词法第一个或系列中的第一个点击量，还是完全不同的东西？希望这个建议已经有用了。

尽管每个类都定义了事件处理程序，但代码仅针对接收事件的单个元素执行 - 如果您有嵌套.arrow元素，您可能希望除了跳过默认操作之外停止事件传播（要使用的方法是eve.stopPropagation, eve.stopImmediatePropagation） .

于 2013-08-06T00:27:31.683 回答