Javascript 页面刷新后有效，不知道解决办法

Question

我在 custom.js 文件中有这两个非常简单的 javascript。

问题是它仅在页面刷新后才有效。

现在它位于 body 标签中。我应该放在哪里？我该如何解决才能使其正常工作（而不是手动刷新站点）。我尝试了 (document).ready 但还是不行。

我的HTML

<body>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://nosolution.com/js/custom.js"></script>

<span class="underline">Text</span>
<button>Change</button>

<span class="underline">Text</span>
<button class="hid">Change</button>

我的javascript

   $(document).on('pageinit',function(){
      $("button").click(function(){
         $("span.underline").addClass("underlined");
      });

     $("button.hid").click(function(){
        $("span.underline").removeClass("underlined");
     });
});

非常感谢您的帮助。

Answer 1

Mike C. 是正确的。你的代码应该这样形成：

$(document).ready(function(){

    $("button").click(function(){
        $("span.underline").addClass("underlined");
    });

    $("button.hid").click(function(){
        $("span.underline").removeClass("underlined");
    });

});

Answer 2

你可以试试这个：

$(document).ready(function(){

    $(document).on('click', 'button', function(){
        $("span.underline").addClass("underlined");
    });

    $(document).on('click', 'button.hid', function(){
        $("span.underline").removeClass("underlined");
    });

});

Javascript 页面刷新后有效，不知道解决办法

Javascript works after page refresh, not knowing the solution

javascript

jquery

load

refresh