jQuery不会完成提交并在地址中添加参数

Question

编辑：更新了 jsFiddle 链接。见第二句。

我正在创建一个网站，使用 subreddit API 为您推荐 subreddit。 该项目是here。目前最好在最大化的浏览器窗口中查看该站点，因为我还没有完成前端。

它的工作原理是从表单中获取输入的 subreddits，将其放入一个数组中（使用 .serializeArray()）。我也使用相同的函数从第二种形式中获取省略的 subreddits。然后它获取值并将它们放在一个字符串中。最终结果（在 api 变量中）应该类似于http://www.reddit.com/api/recommend/sr/AskReddit,CasualConversation,?omit=SkypePals,，具体取决于输入的子版块。 在此之后，它只是使用 api 变量作为 getJSON() 函数的参数，它将来自 Reddit 的 JSON 响应返回到 json 变量中。然后我使用 each() 来迭代 JSON 响应，以便将推荐的 subreddits 放入右列（在推荐下方）。

我花了几个小时试图解决这个问题，但它仍然不起作用。单击提交按钮时，它会刷新页面并使用表单输入的输入将参数添加到地址栏中。我不知道这是为什么。

任何帮助解决此问题并在将来避免此问题将不胜感激。我无法理解这个哈哈。我也找不到任何通过搜索有帮助的东西。我不知道这个问题的名称是什么。

显然，当我链接到 jsFiddle 时，我还需要在这篇文章中提供代码。我认为我的 Javascript 是最相关的，所以我会提供：

$(document).ready(function () {
    var api = "http://www.reddit.com/api/recommend/sr/";
    var json;
    var redditBaseLink = "http://www.reddit.com/r/";
    var srLink;
    var srArray;
    var srString = '';
    var omitArray, omitString;

    $(".srInputForm").submit(function (event) {
        srArray = $(this).serializeArray();
        $.each(srArray, function (i, field) {
            srString += field.value + ",";
        });
        api = api.concat(srString, "?omit=");

        $.each(omitArray, function (i, field) {
            omitString += field.value + ",";
        });
        api = api.concat(omitString);

        json = $.getJSON(api);

        $.each(json, function (i, response) {
            srLink = "";
            srLink = '<div class="recommendation">' + '<a href="' + redditBaseLink + response.sr_name + '/" target="_blank">' + response.sr_name + '</a></div>';

            $(srLink).hide().appendTo(".recommendationsCol").fadeIn('slow');
        });

        event.preventDefault;
    });
});

谢谢

Answer 1

您的 event.preventDefault 中有错字，应该是

event.preventDefault();

另外，检查 $.getJSON 的正确用法，你的 $.each 应该在 $.getJSON 成功回调中。

例如

$.getJSON("ajax/test.json", function(data) {
    // $.each() here.
});