javascript - 项目单独显示

Question

如何show()单独制作，一旦我单击显示，所有.whateverever类都会打开。

这是代码：

$(document).ready(function() {
    function excerpt(text, len) {
        return text.substring(0, len) + "&hellip;" + '<span>Show</span>';
    }

    var $div = $('.container');
    $div.each(function() {
        var $p = $(this).find("p:first");
        var theExcerpt = excerpt($p.text(), 230);
        $p.data('html', $p.html()).html(theExcerpt);
    });

    $('span').click(function() {
        var isHidden = $(this).text() == 'Show';
        var $p = $(this).parent();
        var theExcerpt = excerpt($p.text(), 230);
        $p.html(isHidden ? $p.data('html') : theExcerpt);
        $('.whateverever').show();
        $(this).remove();
    });

});​

请在线查看示例：http: //jsfiddle.net/M6wzh/6/ 非常感谢

Answer 1

尝试

$(document).ready(function() {
    function excerpt(text, len) {
        return text.substring(0, len) + "&hellip;" + '<span>Show</span>';
    }

    var $div = $('.container');
    $div.each(function() {
        var $p = $(this).find("p:first");
        var theExcerpt = excerpt($p.text(), 230);
        $p.data('html', $p.html()).html(theExcerpt);
    });

    $('span').click(function() {
        var isHidden = $(this).text() == 'Show';
        var $p = $(this).parent();
        var theExcerpt = excerpt($p.text(), 230);
        $p.html(isHidden ? $p.data('html') : theExcerpt);
        $p.next().show();//the div you're looking for is the next sibling of the parent p
        $(this).remove();
    });

});​

http://jsfiddle.net/mowglisanu/M6wzh/7/

Answer 2

$('.whateverever', this).show();

代替

$('.whateverever').show();

应该让你上路。

Answer 3

你可以这样做：

$('span').click(function() {
    var isHidden = $(this).text() == 'Show';
    var $p = $(this).parent();
    var theExcerpt = excerpt($p.text(), 230);
    $p.html(isHidden ? $p.data('html') : theExcerpt);
    $(this).next(".whateverever").show();
    $(this).remove();
});

小提琴

Answer 4

在此之前你有没有使用过 jquery 的 .closet() 。只需对您的代码进行少量编辑

   $('.whateverever').show();
replace this line by        
   $.closest('.whateverever').show();
  and check.