0

我有一个从 JSON 对象中获得的书串对象。这个 Book 对象有三个键值对,Title、Author 和 URL。我使用 for 循环来读取每个对象,并将对象的标题作为按钮放在 html 页面上。但是,当单击按钮时,我希望提醒该书的 URL。当我阅读这些对象时,我制作了 Books 对象并将其推入一个数组以供以后使用。但我无法使用 .Click() 方法 URL 不正确。请查看代码以获得更好的理解。:-)

for (i = 0; i < 6; i++) //I know that there is only 65 Books..jsonString.books.lenght is not working.
{
    var title = jsonString.books[i].title;
    var classname = title.replace(/\s/g, "");
    var author = jsonString.books[i].author;
    var URL = jsonString.books[i].url;
    var htmlString = '<div class="' + classname + '"><input type="button" value="' + title + '"></div>';
    $(htmlString).appendTo(attachPoint).click(function () {
        loadBook(URL);
    });

    OneBook = new Book(author, title, URL);
    arr.push(OneBook);
}

attachpoint 是我从中获得的 html 文件中的引用

var attachpoint=document.querySelector('.buttonAttachPoint');

所以在上面的代码中,我点击的 URL 始终是 jsonString 中的最后一个对象。这是因为 for 循环而发生的。那么有没有一种方法可以获取具有 onclick 或按钮标题的 Div 的类名,以便我可以从我创建的对象数组中获取 URL?或者有没有更简单的方法。也有人能指出为什么“jsonString.books.lenght”不起作用?在此先感谢。:-) 非常感谢所有帮助。:-)

4

2 回答 2

2

使用立即调用的函数表达式创建闭包应该可以解决问题。只需替换这个:

$(htmlString).appendTo(attachPoint).click(function () {
    loadBook(URL);
});

有了这个:

(function(URL) {
    $(htmlString).appendTo(attachPoint).click(function () {
        loadBook(URL);
    });
})(URL);

URL在该匿名函数的范围内将具有传递给它的值,这将是该for循环迭代的正确值。

于 2013-03-27T16:30:19.107 回答
1

在 ECMAScript 中,变量的作用域是它们的函数,而不是任何块。

您要绑定的函数在整个循环的上下文中click具有闭包,而不是在循环迭代的上下文中。URLURL

这意味着无论何时调用任何函数,都URL将具有循环设置的最后一个值。

您需要冻结URL每个循环的值。做到这一点的一种方法是在其他地方有一个函数URL作为参数,并返回一个关闭它的函数,因此:

function getBookLoader(url) {
  return function (){
    loadBook(url);
  };
}

然后,您可以将您的... .click行替换为以下内容:

$(htmlString).appendTo(attachPoint).click(getBookLoader(URL))

要回答标题中的问题,事件的属性包含target事件被分派到的对象,而currentTarget属性包含当前正在评估其侦听器的对象。 currentTarget应该是有div问题的。

于 2013-03-27T16:35:44.263 回答