.Click函数在jQuery中不起作用

Question

我需要的：

我需要在单击button1时显示button2。 新材料：我需要做的是将button2保存在那里，所以如果您刷新或“运行”按钮2已经在那里，我该怎么做？

我已经完成/尝试过的事情：

我尝试了很多不同的事情，例如在更改范围周围进行了更改，以及检查控制台错误，但没有得到任何信息，所以我不太确定这是怎么回事。

码

$(document).ready(function () {
  $('#button2').hide();
  window.highestLevel = 1;

$('#button1').click(function () {
    Check();
    highestLevel = 2;
});

  if (highestLevel == 2) {
    $('#button2').show();
}

function Check() {
    localStorage.setItem('highestLevel', highestLevel);
  }

});

有什么用

唯一起作用的是，当我单击$('#button1')时，它将正确地存储到html本地存储中。

链接 ， jsFiddle

Answer 1

为了使它如您所描述的那样起作用，if结构...

if (highestLevel == 2) {
    $('#button2').show();
}

...必须位于click函数中。 尝试...

$('#button1').click(function () {
    Check();
    highestLevel = 2;
    $('#button2').show();
});

您确实不需要用这种方式的if-结构...在您的代码中，if-结构仅在文档就绪（一次）上运行。

Answer 2

您对正在发生的事情感到误解。 此代码块在加载文档时运行，而不是在单击button1之后运行。

您想将其放在点击功能中

$('#button1').click(function () {
  Check();
  highestLevel = 2;

  if (highestLevel == 2) {
    $('#button2').show();
  }
})

您还将希望通过添加事件对象来阻止按钮的默认操作，该默认操作是发布导致其重新加载的页面

$('#button1').click(function (e) {
  e.preventDefault();
  Check();
  highestLevel = 2;

  if (highestLevel == 2) {
    $('#button2').show();
  }
})


});

Answer 3

您不需要所有这些...问题是

if (highestLevel == 2) {
    $('#button2').show();
}

文档准备好后，仅执行一次。

尝试这个：

$(document).ready(function () {
  $('#button2').hide();

  $('#button1').click(function () {
     $('#button2').show();
  });
});

Answer 4

试试这个

        window.highestLevel = localStorage.getItem('highestLevel');
        $(document).ready(function () {
            if (highestLevel == 2) {
                $('#button2').show();
                $('#button1').hide();
            }
            else {
                highestLevel == 1
                $('#button1').show();
                $('#button2').hide();
            }

            $('div').click(function () {
                if (highestLevel == 2) {
                     highestLevel = 1;
                    $('#button1').show();
                    $('#button2').hide();
                }
                else{
                    highestLevel = 2;
                    $('#button2').show();
                    $('#button1').hide();
                }
                Check();
            });
        });


        function Check() {
            localStorage.setItem('highestLevel', highestLevel);
        }