我的脚本只运行一次，我希望无限次不重新加载html页面

Question

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Animations</title>


    <link rel="stylesheet" type="text/css" href="css/animate.css">

    <script src="js/jquery.js"></script>

    <script type="text/javascript">


      $(document).ready(function(){

            $(".box").on("click", function(){

              $(".container").addClass("animated rollIn");
             //$(".container").addClass("rollIn"); we have the same result


            });



            $("#join_us button").on("click", function(){

              $(this).addClass("animated shake");

            });


        });

    </script>
</head>

Why the two functions are executed only at the first time (only once) each of them when I click the box and button of my html page? 为什么当我单击html页面的框和按钮时，这两个函数仅在第一次（仅执行一次）时执行？ Do you have any solution? 你有什么解决办法吗？ I searched a lot here the topics but I didn't manage to fix the problem. 我在这里搜索了很多主题，但未能解决问题。

Ps: sorry for any mistake if any, it's the first time I post a topic. ps：很抱歉有任何错误，这是我第一次发布主题。

Answer 1

Try using this, where the class is added in setTimeout 尝试使用此方法，在setTimeout添加类

 <div class="container">DIV 1</div> <button class="box">Roll In</button> <div id="join_us"> <button>Shake It</button> </div> <link href="https://daneden.github.io/animate.css/animate.min.css" rel="stylesheet"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> $(document).ready(function(){ $(".box").on("click", function(){ $(".container").removeClass("animated rollIn"); setTimeout(function(){ $(".container").addClass("animated rollIn"); },1); }); $("#join_us button").on("click", function(){ var button = $(this); button.removeClass("animated shake"); setTimeout(function(){ button.addClass("animated shake"); },1); }); }); </script>

我的脚本只运行一次，我希望无限次不重新加载html页面

问题描述

1 个解决方案

解决方案1
0 2016-01-14 16:34:43

我的脚本只运行一次，我希望无限次不重新加载html页面

问题描述

1 个解决方案

解决方案1 0 2016-01-14 16:34:43

解决方案1
0 2016-01-14 16:34:43