Question

我有一些javascript更改#hash网址并使用AJAX将一些HTML加载到元素中。

// Manually trigger a hashchange to start the app.
$(window).trigger('hashchange');


function makeContentView() {
  document.location.hash = "content";
  return false; // we don't want event propagation - just AJAX call
}


$(function () {

  $(window).on('hashchange', function () {
    // On every hash change the render function is called with the new hash.
    // This is how the navigation of our app happens.
    render(window.location.hash);
  });

  function render(url) {
    // This function decides what type of page to show 
    // depending on the current url hash value.

    switch (url) {
      case "#home":
        $("#AJAX_Parent").load("body/index_body.html #AJAX_Child");
        break;
      case "#grid":
        $("#AJAX_Parent").load("body/grid_body.html #AJAX_Child", function () {

            var contents = document.getElementsByClassName("thumbnailImage");

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

                // THIS FUNCTION GETS CALLED WITHOUT ME CLICKING
                contents.item(i).onclick = makeContentView();
              }

          }); // makeContentView IS ALWAYS BEING CALLED IMMEDIATELY
    ... // More switch options

^注意在上面的例子中，“contents.item（i）.onclick = makeContentView（）;”将makeContentView函数分配给我的页面缩略图图像的onclick处理程序，但无条件触发此makeContentView函数。

我只想在使用class = thumbnailImage

点击6个缩略图之一时调用makeContentView

Answer 1

makeContentView();

这是一个函数调用。不要使用（）来分配函数引用。

Answer 2

因为您正在调用它，只需将其设为

即可

contents.item(i).onclick = makeContentView; //remove the parenthesis from the end

Answer 3

将()放在功能名称后面，立即调用它。删除它们以将函数指定为onclick处理程序（您现在正在分配其结果）。

Answer 4

您希望contents.item(i).onclick = makeContentView 不用括号。原因是Javascript基本上运行了它在结尾处()找到的任何函数，只要它读取它。

你没有希望 Javascript在读取它时立即运行此功能。相反，你只想告诉Javascript有关该功能 - 也就是说，你只想引用该功能，而不是调用它。

为什么这个javascript onclick加载代码运行没有我明确告诉它？

4 个答案: