2

我试图运行一个函数两次。页面加载时一次，然后单击时再次。不知道我做错了什么。这是我的代码：

$('div').each(function truncate() {
    $(this).addClass('closed').children().slice(0,2).show().find('.truncate').show();
});

$('.truncate').click(function() {

    if ($(this).parent().hasClass('closed')) {
        $(this).parent().removeClass('closed').addClass('open').children().show();
    }

    else if ($(this).parent().hasClass('open')) {
        $(this).parent().removeClass('open').addClass('closed');
        $('div').truncate();
        $(this).show();
    }

});

问题出在第 13 行，我truncate();第二次调用该函数。知道为什么它不起作用吗？

在此处编辑jsFiddle：http: //jsfiddle.net/g6PLu/

4

4 回答 4

4

那是一个命名的函数文字。

该名称仅在函数范围内可见。
因此，truncate在处理程序之外不存在。

相反，创建一个普通函数并将其传递给each()：

function truncate() { ...}

$('div').each(truncate);
于 2012-05-18T21:41:42.693 回答
0

你得到什么错误信息？

您应该创建函数，然后根据要求调用它

定义函数

function truncate(){
  $('div').each(function(){

  });
}

然后调用函数

truncate();
于 2012-05-18T21:48:45.380 回答
0

另一种方法是建立并触发自定义事件：

$('div').on('truncate', function() {
    $(this).......;
}).trigger('truncate');

然后，在您需要相同操作的其他地方，再次触发该事件。

截断所有 div ：

$('div').trigger('truncate');

同样，您可以只截断一个特定的 div ：

$('div#myDiv').trigger('truncate');

唯一的先决条件是已经附加了自定义事件处理程序，所以......

$('p').trigger('truncate');

不会做任何事情，因为尚未为p元素建立截断处理程序。

于 2012-05-18T23:13:36.290 回答
0

我知道已经有一个公认的答案，但我认为最好的解决方案是插件http://jsfiddle.net/g6PLu/13/它似乎符合 OP 想要的精神（能够调用$('div').truncate）。并使代码更简洁

(function($) {
    $.fn.truncate = function() {
        this.addClass('closed').children(":not('.truncate')").hide().slice(0,2).show();
    };
    $.fn.untruncate = function() {
        this.removeClass('closed').children().show();
    };                
})(jQuery);

$('div').truncate();

$('.truncate').click(function() {
  var $parent = $(this).parent();
  if ($parent.hasClass('closed')) {
    $parent.untruncate();
  } else {
    $parent.truncate();
  }
});
于 2012-05-24T17:33:26.610 回答