2015-02-10 52 views
1

即時試圖改變一個元素的innerHTML但它一直在按鈕的每次點擊正在重置回「DDD」的innerHTML不能恰克(保持復位)

<form> 
 
<p id="passError">ddd</p> 
 
<button id="submit">Login</button> 
 
</form> 
 

 
<script type="text/javascript"> 
 
document.getElementById("submit").onclick = function(){changeit()}; 
 
function changeit() 
 
{ 
 
    pError = document.getElementById("passError"); 
 
    pError.innerHTML = ("wrong password"); 
 
</script>

+2

你忘了關閉大括號'}' – antyrat 2015-02-10 16:45:27

+0

感謝我改變了它但它仍然不改「DDD」 – strawheart 2015-02-10 16:48:26

+0

提交表單時,一個新的頁面將被加載服務器響應。使用'button'類型的'button',防止點擊處理程序中的默認動作,刪除表單... – Teemu 2015-02-10 17:11:18

回答

0

首先你在函數中缺少},然後在提交時提交您必須阻止的表單。您不需要changeit函數的包裝函數,您可以直接將它傳遞給onclick變量。

<form> 
<p id="passError">ddd</p> 
<button id="submit">Login</button> 
</form> 

<script type="text/javascript"> 
document.getElementById("submit").onclick = changeit; 
function changeit(event) 
{ 
    event.preventDefault(); 
    pError = document.getElementById("passError"); 
    pError.innerHTML = "wrong password"; 
} 
</script> 
0

你忘了一兩件事,還有一個錯字錯:

  • 你忘了你的功能changeit()作爲mentionned由@antyrat月底結束的方括號};
  • 你想直接放入innerHTML賦值中的字符串,不使用括號。 (見從MDN的innerHTML documentation

此外,你也可以直接通過您的changeit功能,而不是使用匿名函數,並把你的pError在適當的declarated變量。 :)

在使用<form>時,還需要通過在函數的click事件中調用preventDefault()函數來阻止提交按鈕的默認行爲。

以下代碼正在工作。我更正了這些元素,只是添加一些縮進和間距以使代碼更加用戶友好。

<form> 
 
    <p id="passError">ddd</p> 
 
    <button id="submit">Login</button> 
 
</form> 
 

 
<script type="text/javascript"> 
 

 
document.getElementById("submit").onclick = changeit; 
 

 
function changeit(evt) { 
 
    evt.preventDefault(); 
 
    var pError = document.getElementById("passError"); 
 
    pError.innerHTML = "wrong password"; 
 
} 
 
</script>

+0

奇怪。這工作時,我運行在stackoverflow片段,但它不工作時,我用firefox運行它 – strawheart 2015-02-10 17:02:04

+0

@strawheart準確地說,這是我的錯。您擁有的提交按鈕在Firefox中具有默認行爲,並使網頁重新加載。要停止它,你必須在你的'changeit'函數中添加'evt.preventDefault();'。我現在正在編輯我的摘錄。 – Eriatolc 2015-02-10 17:06:13