爲什麼js函數不會永久更改html代碼？

在HTML頁面的body中有一個按鈕，它從onclick事件中調用Javascript函數，而在head中是我希望以更持久的結果運行的Javascript函數。爲什麼js函數不會永久更改html代碼？

<!Doctype html> 
<html lang="fr"> 
    <head> 
    <meta charset="utf-8"/> 
     <script type="text/javascript" language="javascript"> 

     function loadformTest(){ 
     document.getElementById('departement').value = '31'; 
     document.getElementById('ville').value = 'toulouse'; 
     document.getElementById('quoi').value = 'société de services informatiques'; 
     annuaire = document.getElementById('annuaire'); 
     recherche = document.getElementById('recherche'); 
     annuaire.innerHTML = 'Annuaire' 
     annuaire.href = "http://www.pagesjaunes.fr/pagesblanches"; 
     recherche.innerHTML = 'Annuaire' 
     recherche.href = "https://google.fr"; 
     } 

     </script> 

    </head> 
    <body> 
    <form id="form" action="" method="post"> 
     <p>Quoi,Qui : <input id="quoi" name="quiQuoiSaisi" type="text"/></p> 
     <p>Ville : <input id="ville" name="ville" type="text"/></p> 
     <p>N°Département : <input id="departement" name="departement" type="text"/><p> 
     <button onclick="loadformTest()">Valeurs par défaut </button> 
    </form> 
    <a id="recherche" href="" target="_blank"></a> 
    <a id="annuaire" href="" target="_blank"></a> 
    </body> 
</html>

但是，如果在加載頁面時body標籤中調用了相同的函數，則這些更改是永久性的。

我的問題可能是由於我對JavaScript的知識不足！

來源

2015-02-08 AlbanMar31

你能澄清你的意思是「更永久」嗎？ – wnbates 2015-02-08 15:28:07

您是否希望這些值默認顯示？ – wnbates 2015-02-08 15:30:06

當我點擊按鈕時，該函數將運行，但HTML更改不是永久性的：下一秒，所有內容都會在Firefox瀏覽器中恢復到原始狀態。 – AlbanMar31 2015-02-08 15:33:56

將onclick按鈕更改爲包含「return false;」。此時按鈕導致頁面在運行腳本後重新加載。

<button onclick="loadformTest(); return false;">Valeurs par défaut </button>

，或者如果您指定按鈕的類型是一個按鈕（而不是提交，這可能是瀏覽器的默認設置），則該按鈕不會引起刷新。

<button type="button" onclick="loadformTest()">Valeurs par défaut </button>

來源

2015-02-08 15:37:20 wnbates

您的代碼無法正常工作的原因是，當按鈕被點擊時，表單被提交，並且由於操作被設置爲""整個頁面將重新加載自身。嘗試將onsubmit添加到您的形式是這樣的：

<form id="form" action="" method="post" onsubmit="return false;">

來源

2015-02-08 15:35:07

我不知道可以在沒有表單標籤的情況下編寫輸入標籤。謝謝我檢查它相當準確！ – AlbanMar31 2015-02-08 15:40:54

使用

<button type="button" onclick="loadformTest()">Valeurs par défaut </button>

使按鍵不執行表單提交到一個空的URL（動作標籤不能爲空）。

來源

2015-02-08 15:36:47 halafi

爲什麼js函數不會永久更改html代碼？

回答

相關問題