Question

我有一个带有两个参数的javascript函数： results 是一个对象数组， i 是索引。

该函数显示该数组中的项目。我还想构建链接以显示数组中的其他条目。

我的代码是：

function renderNews(results, i) {
    $('.articleTitle').text(results[i].Title);
    $('.articleBody').text(results[i].newsBody);

    // Build links
    var linkHtml = '';

    for (var i = 0; i < results.length; i++) {

   linkHtml += '<a href="#" onclick="renderNews(results, ' + i + ')">' + (i + 1) + '</a> ';
    }

    $('.articleActions').html(linkHtml);
}

正如您所看到的，我正在设置我的onclick函数来调用自身来重绘结果。我得到了“函数未定义错误”。

我一直在学习。函数调用自身是不是一个好主意？我想知道是否有人可以就正确的方式提出建议。

Answer 1

如果我理解，页面加载时会调用renderNews，对吧？实际上，您的链接将放在articleActions类的组件中。根据您的想法，单击任何链接将再次调用此函数，并且所有链接将被新链接替换。这听起来很奇怪。另外，在将results传递给onclick事件时，我无法确定您的期望。实际上，如果你的想法总是重复使用相同的结果数组，一遍又一遍地将它无限期地传递给同一个函数，你可以使事情变得更简单：

function renderNews(results) {

    if (results.length == 0)
      return;

    // Build links
    var linkHtml = '';

    for (var i = 0; i < results.length; i++)
       linkHtml += '<a href="#" data-articletitle="' + results[i].Title + '" data-articlebody="' + results[i].newsBody +'" class="article-link">' + (i + 1) + '</a> ';

    $('.articleActions').html(linkHtml);

    $('.articleTitle').text(results[0].Title);
    $('.articleBody').text(results[0].newsBody);

}

$('.article-link').click(function(){
    $('.articleTitle').text($(this).data('articletitle'));
    $('.articleBody').text($(this).data('articlebody'));
});

据我了解，每当您想要更新当前文章时，都会调用renderNews，它将为包含其数据（标题和正文）的数组中的每篇文章构建/重建大量链接，以及将加载第一个项目。所以一旦页面加载就会调用renderNews（我不知道你打算怎么做）。

任何包含 article-link 类的组件都有点击事件，在这种情况下是所有链接（锚点）。单击一个时，它会使用其数据更新屏幕（文章的标题和正文）。

您可以改进代码以跟踪所选项目，并在调用renderNews后，加载该文章而不是第一篇。或者您可以继续将文章的索引作为参数传递，就像您的示例一样。

由于我不知道如何调用renderNews函数，因此很难编写更好的代码，但这可能会让您感到清楚。

简单JSFiddle demo

Javascript函数调用自己

1 个答案: