Question

我正在尝试实现一个匿名回调函数。我写的代码是janky，我知道。

键入intro是一个范围，它使用给定的参数激活.typed动画。我需要激活和不需要的是最后一个通过id删除这两个元素的函数。无法弄清楚如何。

<!-- Executes intro typing text -->
<script>
  document.getElementById('intro-button').onclick = function() {
    $(function() {
      $("#typing-intro").typed({
             strings: ["&emsp;INITSEG  = DEF_INITSEG</br>&emsp;SYSSEG"],
             typeSpeed: 0,
             backDelay: 20,
             loop: false,
             loopCount: false,
        }, function (){
           document.getElementById("intro-section").remove();
           document.getElementById("typing-intro").remove();
        });
      });
    }
    ///script
</script>

Answer 1

typed.js并不真正将回调作为单独的参数处理。它在jQuery原型上扩展的方法是：

$.fn.typed = function(option) {

因此，您必须将其作为callback对象的options键的一部分传递。

$("#typing-intro").typed({
             strings: ["&emsp;INITSEG  = DEF_INITSEG</br>&emsp;SYSSEG"],
             typeSpeed: 0,
             backDelay: 20,
             loop: false,
             loopCount: false,
             callback: function (){
                document.getElementById("intro-section").remove();
                document.getElementById("typing-intro").remove();
             }
        });
      });

remove也没有DOMElement方法，这是一个jquery的事情。

$('#intro-section').remove();
$('#typing-intro').remove();

Answer 2

正如MinusFour指出的那样，打字的动画功能并没有将回调函数作为最终参数。而是一个＆＃34;回调＆＃34;函数通过选项传递给它

除了这个问题之外，你可以用代码清理很多东西。由于您已经使用了jQuery，因此可以清理事件处理程序。而不是document.getElementById('intro-button').onclick = function() { ... }，您可以拥有$('#intro-button').click(function() { ... });。如果您将此<script>放在<head>中，则需要将整个内容包装在$(function() { ... })中，而不是卡在代码中间。

最后，因为您在其他地方使用jQuery，而不是document.getElementById（＆＃34; intro-section＆＃34;）。remove（）;只需要$（＆＃39; #intro-section＆＃39;）。remove（）。

所以它想要这样：

$(function() {
    $('#intro-button').click(function() {
          $("#typing-intro").typed({
             strings: ["&emsp;INITSEG  = DEF_INITSEG</br>&emsp;SYSSEG"],
             typeSpeed: 0,
             backDelay: 20,
             loop: false,
             loopCount: false,
             callback: function (){
                $("#intro-section").remove();
                $("#typing-intro").remove();
             }
        });
    })
})

Javascript回调函数故障

2 个答案: