javascript將文本分割爲單詞列表，然後動態添加到div，表單標籤將其搞亂

Question

我在asp.net webform中測試此代碼，因爲我正在尋找將文本分成javascript或單詞每個都加入到它自己的div中。

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_split

然而，在一個asp.net網絡表單，示例代碼單獨產生奇怪的行爲，結果出現和消失。只需將表單標籤添加到在線樣本中即可再現行爲。

<form id="form1" runat="server"> 

</form> 

有沒有這種方法或替代的想法在javascript中做到這一點的解決方法？

感謝

Answer 1

遇到正在發生的事情，因爲按鈕被觸發回發到服務器的行爲。這基本上重新加載頁面，這就是爲什麼它看起來好像文本出現然後立即消失。然而

<form id="form1" runat="server"> 
    <p>Click the button to display the array values after the split.</p> 

    <button onclick="myFunction();return false;">Try it</button> 

    <p id="demo"></p> 

    <script> 
     function myFunction() { 
      var str = "How are you doing today?"; 
      var res = str.split(" "); 
      document.getElementById("demo").innerHTML = res; 
     } 
    </script> 
</form> 

，我不建議使用onclick屬性調用JavaScript函數，因爲有更好的方法來做到這一點：

您可以通過onclick="myfunction()"這樣加入後在return false;解決這個問題。就你的例子而言，我提供了最簡單的解決方案，但我想讓你知道有更好的方法來處理這個問題。

Answer 2

進行了擴展，霍華德Renollet的解釋爲形式的行爲：

一個<button>元素具有不同types。 W3Schools mentions that "different browsers may use different default types for the element."

在表單中，submit和reset類型實際上會對錶單做些事情！爲了把一個按鈕到表單中沒有它提交表單，將類型設置爲button：

<form> 
    <button type="button">Yay, I won't submit this form!</button> 
</form>