根据屏幕宽度隐藏链接标题属性 - 不会取消隐藏

Question

我在此基础上尝试了一些我已经收集到的内容，但这只是简单地将其完全删除;标题不会在< = 768px

<script> 
if($(window).width() > 767) { 

    $('[title]').each(function() { 

     var $this = $(this); 
     $this.data('title',$this.attr('title')); 
     $this.removeAttr('title'); 

    }); 
} 
</script> 

返回回见http://jsfiddle.net/2nHxV/

Answer 1

所以把它放回去？

var $titles = []; 

if($(window).width()> 767) { 
    $('[title]').each(function() { 
     var $this = $(this); 
     $this.data('title',$this.attr('title')); 
     $this.removeAttr('title'); 

     $titles.push($this); 
    }); 
} else { 
    $.each($titles, function(index, $this) { 
     $this.attr('title',$this.data('title')); 
    }); 
} 

工作演示：http://jsfiddle.net/z3rr9d04/

您还可能希望把这个逻辑$(window).on('resize', ...);处理器中，因为它只会进行一次在页面加载当前标准的执行。

Answer 2

if ($(window).width() > 767) { 
    $('[title]').each(function() { 
     var $this = $(this); 
     $this.data('title',$this.attr('title')); 
     $this.removeAttr('title'); 
    }); 
} else { 
    // as in above `title` attribute removed and `data-title` added, so now you've 
    // to loop with data-title 
    $('[data-title]').each(function() { 
     var $this = $(this); 
     $this.data('title',$this.data('title')); 
     $this.removeAttr('data-title'); 
    }); 
}