幽夜 :
在 IE 中可使用style="word-break:break-all"
来解决文章过长的问题,但是在 Mozilla / Firefox 中却没有作用,请问该如何解决?
- 关键字 : break, 问题, 作用, 中可使用, 中却没, style, Mozilla, Firefox
幽夜 :
在 IE 中可使用所以我猜想这可能是 Firefox 一直没有支援 word-break 的原因吧!
一般的解决方法可以用 Div 配合 style="overflow:hidden;" 的样式来维持被撑大的页面。
另外一样方法可以用 JavaScript 配会 class 标签来修正被撑大的页面来达到类似 word-break 的效果。
function breakWord(dEl){
if(!dEl || dEl.nodeType !== 1){return false;}
else if(dEl.currentStyle && typeof dEl.currentStyle.wordBreak === 'string'){
breakWord = function(dEl){
dEl.runtimeStyle.wordBreak = 'break-all';
return true;
}
return breakWord(dEl);
}
else if(document.createTreeWalker){
var trim = function(str){
var strstr = str.replace(/^\s\s*/, ''),
ws = /\s/,
i = str.length;
while (ws.test(str.charAt(--i)));
return str.slice(0, i 1);
}
breakWord = function(dEl){
var dWalker = document.createTreeWalker(dEl, NodeFilter.SHOW_TEXT, null, false);
var node,s,c = String.fromCharCode('8203');
while(dWalker.nextNode()){
node = dWalker.currentNode;
s = trim(node.nodeValue).split('').join(c);
node.nodeValue = s;
}
return true;
}
return breakWord(dEl);
}
else{return false;}
}
var aEl = document.getElementsByTagName('div');
var dEl,i;
var sName = "break-word";
var oReg = new RegExp('(\\s|^)' sName '(\\s|$)');
for(i=0;dEl = aEl[i];i ){
if(dEl.className.match(oReg)){breakWord(dEl);}
}
记得这段 Javascript 必须加载在网页的尾端才会有作用唷!