为按钮的 onClick 定义的所有函数都被调用答案

【问题标题】：All the functions defined for onClick of button are getting called为按钮的 onClick 定义的所有函数都被调用
【发布时间】：2014-12-09 18:22:35
【问题描述】：

我在 jsp 和 js 中有以下代码。发生的事情与我单击的按钮无关，两个 javascript 函数都被调用。我不确定我在这里缺少什么？

HTML：

<a type="button" id="scrollOffsetDiv" href="dashboard?offloglag=off&duration=${duration}#offset">Offset</a>

<a type="button" id="scrollMsgDiv" href="dashboard?offloglag=off&duration=${duration}#offset">Msg</a>

JS：

    $(document).on("click","#scrollOffsetDiv", setTimeout(scrollOffsetDiv,3000));
    function scrollOffsetDiv() {
        var scrollTop     = $(window).scrollTop(),
            elementOffset = $('#offset').offset().top,
            scrollDistance      = (scrollTop-elementOffset);
        alert("2222222222");
        $('html, body').animate({
            scrollTop: scrollDistance
        }, 200);
    }

    $(document).on("click","#scrollMsgDiv", setTimeout(scrollMsgDiv,3000));
    function scrollMsgDiv() {
        var scrollTop     = $(window).scrollTop(),
            elementOffset = $('#msgsbytesinpersec').offset().top,
            scrollDistance      = (scrollTop-elementOffset);
        alert("33333333");
        $('html, body').animate({
            scrollTop: scrollDistance
        }, 200);
    }

添加jsfiddle链接。

【问题讨论】：

我在您的代码中看不到任何问题。您有实时链接供我们测试吗？ JSFiddle？
我不知道这是否是您的问题，但您的链接将在您的函数被触发之前重定向到 dashboard?offloglag=off&duration=${duration}#offset（在您的 3 秒延迟之后）。
不然。重定向后将发生滚动
请提供一些实时代码的链接或在您的问题中添加一个片段，以便我们进行测试。
去掉 preventDefault() 并在函数jsfiddle.net/chepe263/xknegdnL/2的末尾添加 return true

标签： javascript jquery html function onclick

【解决方案1】：

我能够使用这个 jQuery 代码让它工作：

$("#scrollOffsetDiv").click(function(){ setTimeout(scrollOffsetDiv,3000); });
function scrollOffsetDiv() {
    alert("2222222222");
}

$("#scrollMsgDiv").click(function() { setTimeout(scrollMsgDiv,3000) });
function scrollMsgDiv() {
    alert("33333333");
}

虽然我认为主要问题只是需要将您的 setTimeout 函数包装在 function(){} 中。不使用该包装器似乎仅适用于对函数的非参数化调用...如果您使用变量调用函数，请将其包装在 function(){} 中。

任何想提高我在这个问题上的词汇量的人，请随意。我只是通过观察才知道这一点的。

一个更优雅的写法可能是：

$("#scrollOffsetDiv").click(function(){ setTimeout(function(){
    var scrollTop     = $(window).scrollTop(),
        elementOffset = $('#offset').offset().top,
        scrollDistance      = (scrollTop-elementOffset);
    alert("2222222222");
    $('html, body').animate({
        scrollTop: scrollDistance
    }, 200);
},3000); });

$("#scrollMsgDiv").click(function() { setTimeout(function(){
    var scrollTop     = $(window).scrollTop(),
        elementOffset = $('#msgsbytesinpersec').offset().top,
        scrollDistance      = (scrollTop-elementOffset);
    alert("33333333");
    $('html, body').animate({
        scrollTop: scrollDistance
    }, 200);
},3000) });

【讨论】：

由于某种原因，“$("#scrollOffsetDiv").click()" 在我的代码中不起作用。
定义“不工作”。你有控制台看看它是否抛出错误？这是我制作的小提琴：jsfiddle.net/xknegdnL/1
我没有看到任何错误。但是函数本身没有被调用。我尝试使用 e.preventDefault() （由@chepe263 建议）并且它有效。唯一的缺点是它还删除了按钮的 css。
您的更新代码出现错误：Cannot read property 'top' of undefined。您的 HMTL 中没有任何名为 #offset 的元素。你在什么浏览器上测试？你绝对应该得到错误。（在 Chrome 上，我按 F12 并单击“控制台”选项卡。）