Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/85.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Typed.js-如何多次调用函数onClick_Javascript_Jquery_Html_Jquery Plugins - Fatal编程技术网

Javascript Typed.js-如何多次调用函数onClick

Javascript Typed.js-如何多次调用函数onClick,javascript,jquery,html,jquery-plugins,Javascript,Jquery,Html,Jquery Plugins,我正在使用 我想在单击按钮时运行一个函数。但是我只能在第一次单击时让键入的函数工作一次 $(function(){ var options = { strings: ["First sentence.", "Second sentence."], typeSpeed: 0 } $("button").click(function(){ $(".element").typed(options); }); }); 例如

我正在使用

我想在单击按钮时运行一个函数。但是我只能在第一次单击时让
键入的
函数工作一次

$(function(){
    var options = {
        strings: ["First sentence.", "Second sentence."],
        typeSpeed: 0
    }
    $("button").click(function(){
        $(".element").typed(options);
    });
});

例如,请参阅此提琴:

Type.js没有给出任何方法。我尝试使用它的api,但它在任何地方都使用seTimeout,并且异步运行,不提供任何承诺/延迟对象。要使其工作,一个解决方案是删除元素并重新创建。就我个人而言,我不喜欢这个解决方案,它看起来很粗糙,但它完成了任务

$(function(){
    var options = {
        strings: ["First sentence.", "Second sentence."],
        typeSpeed: 0,
        callback: function(){
            var x = $(".element").text();
            $("#maindiv").html("");
            $("#maindiv").append('<span class="element">'+x+'</span>');
        }
    }
    $("button").click(function(){ 
        $(".element").text('');
       $(".element").typed(options);        
    });
}); 
$(函数(){
变量选项={
字符串:[“第一句话”,“第二句话”。],
打字速度:0,
回调:函数(){
var x=$(“.element”).text();
$(“#maindiv”).html(“”);
$(“#maindiv”)。追加(“”+x+“”);
}
}
$(“按钮”)。单击(函数(){
$(“.element”).text(“”);
$(“.element”)。键入(选项);
});
}); 
在HTML中

<div id="maindiv"><span class="element"></span></div>
<button>Type!</button>

打字!

我最近也遇到了类似的问题。我实现了答案,但我还希望前面的字符串“粘住”

例如,onclick我希望在输入新字符串之前,输入前一个字符串的空格

我把它添加到了类型化的init中

// Set the default string
if(self.isDefaultString) {
    self.strPos = self.strings[self.sequence[self.arrayPos]].length;

    if (self.isInput) {
        self.el.val(self.strings[self.sequence[self.arrayPos]]);
    } else if (self.contentType === 'html') {
        self.el.html(self.strings[self.sequence[self.arrayPos]]);
    } else {
        self.el.text(self.strings[self.sequence[self.arrayPos]]);
    }
}
当类型化对象被启动时,这一点就发生了

// default string of text
this.isDefaultString = this.options.isDefaultString;
然后像这样输入

$("#contact header b").typed({
     strings: ["s1", "s2"],
     isDefaultString: true,
     typeSpeed: 30,
     startDelay: 250,
     showCursor: false
});
结果是,我将在屏幕上以字符串“s2”开头,然后键入,然后删除它并键入“s1”


这是很有用的,因为如果您想在稍后单击时键入调用。您可以将默认设置为“s2”。然后,typed将删除“s2”并打印“s3”。

单击按钮启动键入的插件。再次单击没有效果,因为插件已经在运行。你在这里期待什么行为?@Rorymcrossan让它重置并再次开火。我尝试了
var-typed=new-typed()但无法使其工作。我想应该是这样的谢谢,是的,它很粗糙,但很有效。我希望API能够支持这样的东西。