jquery .append()工作然后消失了吗？

Question

我在FreeCodeCamp的Wikiviewer上工作,我遇到了一个奇怪的问题.

我只是在这里运行一个基本的例子(它现在还不错,只是概念证明):http: //codepen.io/msmith1114/pen/peBKxM？editors = 1111

我附加在这里(在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>');
      })

所以这真的有两个问题(如果你在控制台打开的情况下尝试它,你会看到)

第一个主要问题:列表将显示(3个链接),然后消失......这没有任何意义.据我所知,jquery.append()应该将它们留在那里,因为我将它们附加到我的html部分中

第二个问题:似乎有时getJSON不会返回任何内容.我认为在.done()部分中包装我的语句会确保在维基百科API返回之前不会做任何事情,但有时你却得不到任何回报.这是一个WikiAPI问题还是别的？(顺便说一句,如果它不起作用,只需在搜索框中输入"cat"或其他内容并再次点击搜索,它最终会一直有效,直到你遇到上面的问题1).

谢谢.我还在学习JS/Jquery所以我有点不解为什么这不起作用.

Answer 1

第一个问题是因为你已经迷上了点击提交按钮.这不会停止表单提交,因此页面会重新加载.请使用元素的submit事件,form并确保调用preventDefault()提供的事件:

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

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

至于第二个问题,它可能是一个限制性问题.没有看到错误,就不可能给你一个明确的答案