在jquery中隐藏字符

我需要隐藏字符后35和当我悬停文本显示全文帮助我

<a class="dep_buttons" href="#"> something text something text something text something text something text something text </a>

$('.dep_buttons').mouseover(function () { 
    if($(this).text().length > 30) {
       $(this).stop().animate({height:"150px"},150);
}
})
$(".dep_buttons").mouseout(function(){
    $(this).stop().animate({height:"40px"},150);
});

$（'.dep_buttons'）.mouseover（函数（）{
如果（$（this）.text（）.length>30）{
$（this.stop（）.animate（{height:“150px”}，150）；
}
})
$（“.dep_按钮”）.mouseout（函数（）{
$（this.stop（）.animate（{height:“40px”}，150）；
});

演示

Jquery

    $(function () {
    $('.dep_buttons').each(function () {
            var stringText = $(this).text().trim();
            var substringText=stringText.substring(stringText,35);
            var remainingText=stringText.substr(35);
        $(this).html(substringText);
         $('.dep_buttons').mouseover(function () { 
                $(this).find('a').show();
          }).mouseout(function(){
                $(this).find('a').hide();
            });

        $('<a style="display:none;">'+remainingText+'                 </a>').appendTo($(this));
        });
});

$（函数（）{
$（'.dep_按钮'）。每个（函数（）{
var stringText=$（this.text（）.trim（）；
var substringText=stringText.substring（stringText，35）；
var remainingText=stringText.substr（35）；
$（this）.html（substringText）；
$（'.dep_buttons'）.mouseover（函数（）{
$（this.find（'a'）.show（）；
}).mouseout（函数（）{
$（this.find（'a'）.hide（）；
});
$（''+剩余文本+''）。附加到（$（此））；
});
});

这样做：

var text = $('.dep_buttons').text();
if(text.length > 35) {
    var subText = text.substring(0,35) + '...';
    $('.dep_buttons').text(subText);
    $('.dep_buttons').mouseover(function () { 
        $('.dep_buttons').text(text);    
    });
    $(".dep_buttons").mouseout(function(){
        $('.dep_buttons').text(subText);
    });
}

这里是

我使用了Javascript的切片方法

$(function(){
   var text = $('.dep_buttons').text();         
    var rem = text.slice(29, $('.dep_buttons').text().length);
text = text.replace(rem,"");
    var span = text + " <span class='toggleText'>"+rem+"</span>"            
$('.dep_buttons').text("").append(span);    
    $('.dep_buttons').mouseenter(function () {             
      $(this).find(".toggleText").stop().animate({opacity:1},500);
   });
   $(".dep_buttons").mouseleave(function(){             
      $(this).find(".toggleText").stop().animate({opacity:0},500);
    });
})

$（函数（）{
var text=$（'.dep_按钮'）.text（）；
var rem=text.slice（29，$（'.dep_按钮'）.text（）.length）；
text=text.replace（rem，“”）；
变量span=text+“”+rem+“”
$（'.dep_按钮'）。文本（“”）。追加（span）；
$（'.dep_buttons'）.mouseenter（函数（）{
$（this.find（“.toggleText”）.stop（）.animate（{opacity:1}，500）；
});
$（“.dep_按钮”）.mouseleave（函数（）{
$（this.find（“.toggleText”）.stop（）.animate（{opacity:0}，500）；
});
})

，请看这是否有效！当你们运行浏览器时，第一个文本是满的，我不会这样做