javascript - Jquery 窗口大小。使用文本字符限制更改 css 类

Question

我有三种不同的响应式: 大型显示器最小宽度:1200px 小型显示器(最小宽度:992px)和(最大宽度:1199px) 平板电脑(最小宽度:768px)和(最大宽度:991px)

我正在尝试使用以下代码更改上述三种屏幕尺寸的字符限制。有人可以让我知道我在这里做错了什么。 http://jsfiddle.net/soulsurfer/5SM9u/30/

function checkWidth() {
    if ($(window).width() < 1280) {
        $("#limit-char").each(function(i){
        len=$(this).text().length;
           if(len>30)
            {
              $(this).text($(this).text().substr(0,30)+'...');
            }
        })
    } 
}

$(window).resize(checkWidth);

Answer 1

我在这里为你创建了一个例子http://jsfiddle.net/5SM9u/32/

function checkWidth() {
    if ($(window).width() < 700) {
        $('#menu2').addClass('f-nav');
        $("#menu2").each(function(i){
        len=$(this).text().length;
           if(len>30)
            {
              $(this).text($(this).text().substr(0,30)+'...');
            }
        })
    } else{
        $('#menu2').removeClass('f-nav');
        $("#menu2").each(function(i){
        $(this).text($(this).data('originalTxt'));
        });
    }
}
$("#menu2").each(function(){
        $(this).data({originalTxt: $(this).text()});
});
$(window).resize(checkWidth);

出于测试目的，宽度设置为 700。您可以为您的实现更改它。

谢谢