Блог

 function cropText(crop) {
    var str = $('div').text();

    var val=str.substring(0,crop) '...';
    $('div').html(val);
}



$(window).ready(function(){

    var w = $(window).width();

    if ( w > 500 ) {
        cropText(50);
    } else {
        cropText(20);
    }    
})

$(window).resize(function(){

    var w = $(window).width();

    if ( w > 500 ) {
        cropText(50);
    } else {
        cropText(20);
    }    
})
  

Jsfiddle

Проблема в том, что при ширине окна менее 500 пикселей текст обрезается до 20 символов, но когда я изменяю размер этого окна (ширина будет больше 500 пикселей), функция cropText() вырежет обрезанный текст. Но мне нужно, чтобы функция cropText() всегда обрезала исходный текст.

Заранее спасибо.

Вот ваш рабочий пример. http://jsfiddle.net/q8Cfq /

Ваша переменная должна находиться вне функции, чтобы вы могли обращаться к ней каждый раз, когда она вызывается как исходная.

 var str;
$(window).ready(function(){
        str = $('div').text();
        var w = $(window).width();

        if ( w > 500 ) {
            cropText(50);
        } else {
            cropText(20);
        }    
    })
  

Тогда вы могли бы сделать что-то подобное. Потому что он обращается к глобальной переменной, которая была установлена в начале. функция не изменяет его содержимое.

 function cropText(crop) {
    var val=str.substring(0,crop) '...';
    $('div').html(val);
}
  

Это происходит потому, что при вызове resize() вы обрезаете уже обрезанный текст.

Вам нужно сохранить исходный текст где-нибудь в переменной и обрезать по нему, а не по уже обрезанной версии.

При вызове cropText() исходный текст отбрасывается. Оригинал нигде не сохраняется.

Вы могли бы создать скрытый div, содержащий исходный текст, подлежащий обрезке, и скопировать исходный текст в этот div.

 function cropText(crop) {
    var str = $('#hidden-div').text();

    var val=str.substring(0,crop) '...';
    $('div').html(val);
}