如果/ Else正在重新加载页面后工作

Question

IF / ELSE - jQuery

我有一个代码，但它不能像我想要的那样工作..如何设置它在设置分辨率后自动执行？

非常感谢您的帮助！

CodePen example

$(document).ready(function() {
  var width = $(window).outerWidth();
  if (width <= '860') {
    $('[id=title]').each(function() {
        var title = $(this).text();
        if (title.length > 90) {
        title = title.substr(0, 90) + '...';    
        }
        $(this).text(title);
     });
  } else {
    $('[id=title]').each(function() {
        var title = $(this).text();
        if (title.length > 42) {
        title = title.substr(0, 42) + '...';    
        }
        $(this).text(title);
     });
  }
});

<h4 id="title">The Great Big Headline That Attracts User Eyeballs</h4>

Answer 1

您必须在窗口对象上侦听resize事件：$(window).on('resize', function(){

$(window).on('resize', function(){
 var width = $(window).outerWidth();
  if (width <= '860') {
    $('[id=title]').each(function() {
        var title = $(this).text();
        if (title.length > 90) {
         title = title.substr(0, 90) + '...';     
        }
        $(this).text(title);
     });
  } else {
    $('[id=title]').each(function() {
       var title = $(this).text();
        if (title.length > 42) {
         title = title.substr(0, 42) + '...';    
        }
        $(this).text(title);
     });
   }
});

然而，当我看到你的功能时，我相信你应该考虑使用CSS3：这样的事情：

overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 85%;
display: inline-block;