Webkit中的JavaScript錯誤

我寫過一個腳本，如果變量等於true，則會減小div的寬度，然後將其設置爲false。如果變量等於false，則會增加div的寬度。這個代碼是：Webkit中的JavaScript錯誤

var open = false; 
function chat() { 
    if (!open) { 
     document.getElementById("frameholder").innerHTML="div is wide"; 
     document.getElementById("window").style.width="1300px"; 
     document.getElementById("window").style.marginLeft="-650px"; 
     open = true; 
    } 
} 
function unchat() { 
    if (open) { 
     setTimeout("document.getElementById('frameholder').innerHTML='div is skinny'",500); 
     document.getElementById("window").style.width="900px"; 
     document.getElementById("window").style.marginLeft="-450px"; 
     open = false; 
    } 
}

的HTML是這樣的......

<a href="#" onclick="chat()">Open chat</a><br /> 
<a href="#" onclick="unchat()">Close chat</a> 
<div id="window"> 
    <div id="video"> 
    </div> 
    <div id="frameholder"> 
    </div> 
</div>

出於某種原因，這僅適用於Chrome（WebKit的）工作一次。我可以擴大div，然後縮小div，但我無法重新展開它。它在Firefox和IE中運行良好。任何想法爲什麼？

編輯：更新我的代碼到當前狀態並添加HTML示例。不幸的是，我仍然有同樣的問題...

編輯2：我放棄了這一點。無論如何，這個頁面主要用於我的使用，而且我幾乎全部使用Firefox，所以我認爲這不是一個大問題。

來源

2011-05-05 JacobTheDev

'開放== TRUE'？愚蠢。 '（open == true）== true'如何？需要了解什麼是布爾值。 – awm 2011-05-05 00:54:13

錯誤的副本可能會有所幫助。 – 2011-05-05 00:55:13

爲了詳細說明@ awm的註釋，你應該將if（open == true）'改爲'if（open）'，並且將if（open == false）改爲'if（！open）'。 – 2011-05-05 00:55:15

像這樣的東西應該做到這一點：

var open = false, 
    $button = document.getElementById('clickme'), 
    $frameholder = document.getElementById('frameholder'), 
    $window = document.getElementById('window'), 
    timer; 

function toggleChat() 
{ 
    clearTimeout(timer); 
    if (open) 
    { 
     timer = setTimeout(function() 
     { 
      $frameholder.innerHTML="div is skinny"; 
     }, 500); 
     $window.style.width="900px"; 
     $window.style.marginLeft="-450px"; 
    } 
    else 
    { 
     timer = setTimeout(function() 
     { 
      $frameholder.innerHTML="div is wide"; 
     }, 500); 
     $window.style.width="1300px"; 
     $window.style.marginLeft="-650px"; 
    } 
    open = !open; 
} 

toggleChat(); 

$button.addEventListener('click', toggleChat, false);

演示：http://jsfiddle.net/mattball/nuzyJ/

重新OP評論：

這看起來像很多額外的代碼

您可以使用jQuery + CSS類更簡潔，乾淨地做到這一點，它也可以在更大範圍的瀏覽器上工作。我不再贅述了frameholder文本變化，但這裏的想法：

var $frameholder = $('#frameholder'), 
    $window = $('#window'); 

$('#clickme').click(function() 
{ 
    $window.toggleClass('wide'); 
}).click();

http://jsfiddle.net/mattball/pgTJn/

來源

2011-05-05 01:06:00

這看起來像很多額外的代碼...再加上演示不起作用。 – JacobTheDev 2011-05-05 01:11:23

我在演示中調整了一些東西。它現在有效。 – 2011-05-05 01:12:15

好的，現在可以在Webkit中使用，但不能使用Firefox。不知道什麼問題是... – JacobTheDev 2011-05-05 01:13:55

Webkit中的JavaScript錯誤

回答

相關問題