這是一個Opera bug嗎？

這是一個Opera bug嗎？請比較這個jsfiddle jsfiddle.net/n5hBf/1與這一個jsfiddle.net/n5hBf/2你應該看到高度的差異。這兩個jsfiddles是相同的，除了第一個我在一個聲明中設置樣式，並在第二個jsfiddle中我一個接一個地設置它們。這在其他瀏覽器中效果不錯，但在Opera中不會，所以你一定需要最新的Opera來看看我在說什麼。這是一個Opera bug嗎？

編輯：

好了，現在我覺得它實際上不是一個bug，而是如何自動換行是由歌劇院處理方式。它不同於它在其他瀏覽器（如FF，Chrome和IE）中的工作方式。如果添加word-wrap: break-word;到textarea元素，你會明白我的意思：http://jsfiddle.net/n5hBf/5/

編輯2：

問題： 說，如果我們有一個textarea元素是100x100的大小和包含太多文本以適應textarea元素，文本將溢出，從而使滾動條出現。

目標： 在兩個jsfiddles，我試圖textarea元素擴展到足夠大，以適應沒有滾動條的需要內容的大小。

錯誤的解決方案： 第一個jsfiddle在Opera中表現不佳，因爲它的高度比需要的高得多。第二個jsfiddle在Opera中運行良好（意思是它的尺寸已經改變爲內容所需的實際尺寸;不多，不少），儘管Opera的結果與我在其他瀏覽器中觀察到的結果不同。在其他瀏覽器中，只有高度發生了變化。 Opera的結果更寬，因爲它改變了寬度和高度。

瞭解： 正如我想的那樣，默認情況下Opera不會將長單詞分解成行，而是會添加一個水平滾動條。而其他瀏覽器確實將它們分成幾行。此外，瀏覽器渲染它，以便滾動添加只爲了那些長詞的緣故，而其餘的內容佔用相同的寬度...然後我得到了線索！

正確的解決方案： 我理解的是，內容的實際尺寸是根據最初的文本區域的大小定義，所以其中一個維度橫空出世，一旦我們改變了另一個無效。也就是說，如果我們改變寬度，高度不再是實際的，因爲內容在新的寬度上擴展，使得其高度變短。這就解釋了爲什麼第二個jsfiddle按照預期工作：首先，我獲得了新的寬度並應用它，然後內容佔據了新的維度，只有在這之後，我纔得到新的高度並應用它。所以，如果我們需要改變寬度和高度，我們需要先改變寬度然後改變高度。在除Opera以外的瀏覽器中，只需要更改一個維度，所以樣式在第一個jsfiddle中是在一個語句中更改還是在第二個jsfiddle中的兩個語句中更改都沒有區別。

來源

2011-09-10 Polar

說實話，當我想到這一點時，似乎Opera會在其他瀏覽器被破壞時正常運行。 –

@sharth，你爲什麼這麼認爲呢？ – Polar

因爲它並沒有將這個長的「ggg ...」單詞包裝到下一行，而其他瀏覽器卻這麼做？ – Polar

它在Opera中出現的唯一原因是因爲它是唯一一個在textareas上默認不使用word-wrap: break-word的瀏覽器。所以這不是一個錯誤，只是一個不同的默認樣式的結果。

If you add word-wrap: normal to the textarea CSS in your fiddle它會在其他瀏覽器中以相同的方式中斷（IE中除外，它以不同的方式中斷）。

沒有word-wrap: break-word，寬度不同於scrollWidth，這意味着改變它會影響scrollHeight。

然而，這樣做

$textarea.css({ 
    width: $textarea[0].scrollWidth, 
    height: $textarea[0].scrollHeight 
});

兩個scrollWidth和scrollHeight首先評估之前，他們實際上是設置。這意味着scrollHeight中由於改變寬度而導致的變化未被考慮在內。

將單獨的.css()聲明中的寬度和高度依次設置將意味着scrollHeight將在設置之前被更新。

來源

2011-09-12 22:18:38 mercator

這是一個Opera bug嗎？

回答

相關問題