首页 > 解决方案 > JavaScript逻辑,按钮不起作用

问题描述

我有一些我的简化代码,我不知道为什么它不起作用

<html>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
    </script>

    <div>
        <button class="submit1">update</button>
    </div>
    <br>
    <div>
        <button class="submit2">submit</button>
    </div>
    <br>
    <div class="result"></div>

    <script>
        var myvar = 1;
        $(".submit1").on('click',function(){
            myvar = 2;
        });
        if(myvar == 2){
            $(".submit2").on('click',function(e){
                $('.result').html("it works!"); 

            });
        };
    </script>
</html>

myvar 最初不是 2 的事实似乎基本上忽略了 javascript 的最后一部分,但我不明白为什么,因为我以前从未遇到过这种问题。任何帮助,将不胜感激!

编辑(来自评论):这几乎是我想要的,抱歉我没有指定。我有一些隐藏和显示的对象,并且我有一些更密集的代码,当单击提交按钮或在每个隐藏和显示的对象上按下输入时运行这些代码。但我的问题是,当我按下回车键时,所有代码都会运行,我试图做出一个 if 语句来澄清正在显示的对象,然后只有在显示时才运行代码

标签: javascripthtml

解决方案


我只能猜测,但我相信你是故意的?

var myvar = 1;
$(".submit1").on('click', function() {
  myvar = 2;
});
$(".submit2").on('click', function(e) {
  $('.result').html(myvar == 2 ? "it works!":"Click update first");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div>
  <button class="submit1">update</button>
</div>
<br>
<div>
  <button class="submit2">submit</button>
</div>
<br>
<div class="result"></div>

或者可能:

$(".submit1").on('click', function() {
  $(".submit2").show();
});
$(".submit2").on('click', function(e) {
  $('.result').html("it works!");
});
.submit2 { display:none }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div>
  <button class="submit1">update</button>
</div>
<br>
<div>
  <button class="submit2">submit</button>
</div>
<br>
<div class="result"></div>


推荐阅读