开发者

Small bug since jquery 1.4.3

the recent update to jquery 1.4.3 has introduced a small behavior bug into one of my scripts, and i just cant see what the problem is.

The way i use the scripts means i have to use the latest jquery.

I think it must be in the onClick function. The odd behavior introduced can be seen here: And a test page with console log here when the read more links are clicked for the first time they display instantly, when clicked a second time they reveal in slow animation as they should.

The vars i am using equate to:

            length: %id=truncate%, // 200
            minTrail: 0,  
   开发者_开发技巧         moreText: "%id=open%",  // read more
            lessText: "%id=close%",  // close
            ellipsisText: "%id=starttrunk%",  // ...
            moreAni: "%id=openspeed%",  // slow
            lessAni: "%id=closespeed%" // slow

Here is the script:

(function($){
    $.fn.jTruncate = function(options) {


        return this.each(function() {
            obj = $(this);
            var body = obj.html();

            if(body.length > options.length + options.minTrail) {
                var splitLocation = body.indexOf(' ', options.length);
                if(splitLocation != -1) {
                    // truncate tip
                    var splitLocation = body.indexOf(' ', options.length);
                    var str1 = body.substring(0, splitLocation);
                    var str2 = body.substring(splitLocation, body.length - 1);
                    obj.html(str1 + '<span class="truncate_ellipsis">' + options.ellipsisText + 
                        '</span>' + '<span class="truncate_more">' + str2 + '</span>');
                    obj.find('.truncate_more').css("display", "none");

                    // insert more link
                    obj.append(
                        '<div class="clearboth">' +
                            '<a href="#" class="truncate_more_link">' + options.moreText + '</a>' +
                        '</div>'
                    );

                    // set onclick event for more/less link
                    var moreLink = $('.truncate_more_link', obj);
                    var moreContent = $('.truncate_more', obj);
                    var ellipsis = $('.truncate_ellipsis', obj);
                    moreLink.click(function() {
                        if(moreLink.text() == options.moreText) {
                            moreContent.show(options.moreAni);
                            moreLink.text(options.lessText);
                            ellipsis.css("display", "none");
                        } else {
                            moreContent.hide(options.lessAni);
                            moreLink.text(options.moreText);
                            ellipsis.css("display", "inline");
                        }
                        return false;
                    });
                }
            } // end if

        });
    };
})(jQuery);


                    $().ready(function() {  
                    $('#%id% .trunky').jTruncate({  
                    length: %id=truncate%,  
                    minTrail: 0,  
                    moreText: "%id=open%",  
                    lessText: "%id=close%",  
                    ellipsisText: "%id=starttrunk%",  
                    moreAni: "%id=openspeed%",  
                    lessAni: "%id=closespeed%"  
                    });  
                    }); 


try changing the 'extend' line to

var effectiveOptions={};
$.extend(effectiveOptions,defaults,options);

Then use effectiveOptions in place of options therafter

since otherwise you'll clobber your defaults every call ($.extend destructively modifies its first argument) and the var options was unnecessary since its already local due to being in the argument list.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜