Jquery only works once per page load - want it work more than once without having to reload page

I want to be able to run this script more than once without reloading the page. Have looked att using Live events, but couldn't figure it out. Any help would be greatly appreciated. Btw, I'm a noob and I haven't written the script myself.

我希望能够在不重新加载页面的情况下多次运行此脚本。看过使用直播活动，但无法弄清楚。任何帮助将不胜感激。顺便说一句，我是菜鸟，我自己也没有写过这个剧本。

<script type="text/javascript">

var $elem = $('#wrapper');
$(document).ready(function(){
    $("a#trigger").click(function(event){
        event.preventDefault();
        var full_url = this.href;
        var parts = full_url.split("#");
        var trgt = parts[1];
        var target_offset = $("#"+trgt).offset();
        var target_top = target_offset.top;
        $('html, body').delay(2000).animate({scrollTop:target_top}, 2000).delay(250).queue(function() {
            $('#arm').hide();
            $('#arm').toggleClass('arm-down');
        });
    });
    $(function(){
        $('#arm').hide();
        $('#arm').toggleClass('arm-down');
        $('a#trigger').click(function() {
            $('#trigger').addClass('active');
            $('#arm').delay(500).slideToggle().delay(750).queue(function() {
                $('#arm').toggleClass('arm-grab');
            });
        });
    });
});
</script>

4 个解决方案

#1

Lets assume you dont want to set the click handler a bunch of times. That just leaves the anonoymous function.

让我们假设你不想多次设置点击处理程序。这只是留下了无用的功能。

Step 1. !anonymous

第1步！匿名

Change the anonymous function into a not-anonymous function.

将匿名函数更改为非匿名函数。

function blammo(triggeringEvent)
{
    $('#arm').hide();
    $('#arm').toggleClass('arm-down');
    $('a#trigger').click(function()
    {
        $('#trigger').addClass('active');
        $('#arm').delay(500).slideToggle().delay(750).queue(function()
        {
            $('#arm').toggleClass('arm-grab');
        });
    });
}

Step 2. go blammo

第2步。去blammo

Use the not-anonymous function and use the .on() jQuery function.

使用非匿名函数并使用.on（）jQuery函数。

$(document).ready(function()
{
  ... blah ...
  blammo(null); // instead of the anonymous function.

  $(something).on("some event, maybe click", blammo);
}

#2

Make your anonymous function:

让你的匿名功能：

function(event){
        event.preventDefault();
        var full_url = this.href;
        var parts = full_url.split("#");
        var trgt = parts[1];
        var target_offset = $("#"+trgt).offset();
        var target_top = target_offset.top;
        $('html, body').delay(2000).animate({scrollTop:target_top}, 2000).delay(250).queue(function() {
            $('#arm').hide();
            $('#arm').toggleClass('arm-down');
        });
    });
    $(function(){
        $('#arm').hide();
        $('#arm').toggleClass('arm-down');
        $('a#trigger').click(function() {
            $('#trigger').addClass('active');
            $('#arm').delay(500).slideToggle().delay(750).queue(function() {
                $('#arm').toggleClass('arm-grab');
            });
        });
    });
}

into a function

成功能

function yourFunction(event)

函数yourFunction（事件）

which reduces your onLoad to

这会减少你的onLoad

$(document).ready(yourFunction)

$（文件）。就绪（yourFunction中）

now you can call your function whenever you want

现在您可以随时调用您的功能

<script>
//call your function
yourFunction(null)
</script>

#3

If you want any chunk of js to run more than once, put the whole thing in a function, then use setTimeOut() in it to call itself.

如果你想让任何一块js运行多次，把整个东西放在一个函数中，然后在其中使用setTimeOut（）来调用它自己。

#4

Have no idea what is going on here, but I'll try anyway :-)

不知道这里发生了什么，但无论如何我都会尝试:-)

<script type="text/javascript">
$(function(){
    $('#arm').hide().toggleClass('arm-down');
    $('#trigger').on('click', function(event) {
         event.preventDefault();
         var hash = this.href.split("#"),
             target_top = hash[1].offset().top;
         $(this).addClass('active');
         $('#arm').delay(500).slideToggle().delay(750).queue(function() {
             $(this).toggleClass('arm-grab');
         });
         $('html, body').delay(2000).animate({scrollTop:target_top}, 2000).delay(250).queue(function() {
             $('#arm').hide().toggleClass('arm-down');
         });
    });
});
</script>

#1