jquery .append（）工作然後消失？

我正在爲FreeCodeCamp的Wikiviewer工作，並且遇到了一個奇怪的問題。jquery .append（）工作然後消失？

我剛纔就在這裏運行的一個基本的例子（它現在是不是漂亮可言，概念恰恰證明）： http://codepen.io/msmith1114/pen/peBKxM?editors=1111

IM追加這裏（JS代碼，沒有非常多）：

$("#links").append('<li><a href="' + arrayLinks[0] + '">' + arrayName[0] + '</a></li>'); 
     $("#links").append('<li><a href="' + arrayLinks[1] + '">' + arrayName[1] + '</a></li>'); 
     $("#links").append('<li><a href="' + arrayLinks[2] + '">' + arrayName[2] + '</a></li>'); 
     })

所以這個真的有2個問題（如果你用的控制檯打開試試吧，你會看到）

月1日主要問題：該列表將顯示（3個環節），然後消失..這是沒有意義的。 jquery.append（）應該讓他們在那裏盡我所知，因爲即時通訊將它們追加到我的html部分

第二個問題：它似乎有時getJSON不會返回任何內容。我認爲在.done（）部分中包裝我的語句將確保不執行任何操作，直到Wikipedia API返回所有內容都可以工作，但有時您只是不會收回任何內容。這是一個WikiAPI問題或其他什麼？（順便說一句，如果它不起作用，只需在搜索框中輸入「cat」或其他內容並再次搜索，它將最終工作，直到遇到上述問題1）。

謝謝。即時通訊仍然學習JS/JQuery的，所以我有點困惑，爲什麼這不起作用。

來源

2017-04-06 msmith1114

第一個問題是因爲你已經迷上了點擊提交按鈕。這不會停止表單提交，因此頁面會重新加載。使用submit事件form元素的替代，並確保調用preventDefault()所提供的事件：

$(".form-inline").submit(function(e) { 
    e.preventDefault(); 

    // the rest of your code here... 
});

至於第二個問題，這可能是一個限制的問題。沒有看到一個錯誤，這將是不可能的，給你一個明確的答案

來源

2017-04-06 15:58:39

這似乎...喜歡也許我做錯了，如果這是必要的？除此之外，有沒有更好的方法可以做到這一點？或者這是如何在大多數網站上完成的？ – msmith1114

這是應該如何做。它只是改變你的代碼的一行，並添加另一個 –

這裏有一個更新的codepen使用它：http://codepen.io/anon/pen/gmJvvX?editors=1111 –

jquery .append（）工作然後消失？

回答

相關問題