1. 程式人生 > >如何建立一個自己的外掛(自動輸入)

如何建立一個自己的外掛(自動輸入)

要實現模擬的手寫輸入,文字一個一個出現在介面上:

1.jq程式碼 

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>自動填寫文字</title>
	<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<body>
	<div id="textdiv"></div>
	<script>
	$(function(){
		var text = "我的益達我的益達我的益達我的益達我的益達 我的益達我的益達我的益達我的益達吃";
		var length = text.length;
		var textdiv = $("#textdiv");
		var index = 0;
		var Timer = setInterval(function(){
			
			if(index>=length){
				clearInterval(Timer);
			}
			textdiv.html("");
			var myText = text.substring(0,index+1);
			console.log("myText-----------"+myText);
			var regText = /\s+/g;
			if(regText.test(myText)){
				myText = myText.replace(regText,"<br/>");
				index++;
			}
			
			textdiv.html($("#textdiv").html()+myText);
			console.log($("#textdiv").html());
			index++;
			console.log(index);

		},100);
	});
		

	</script>
	


</body>
</html>

 

2.改造後的程式碼

html js外掛

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自動填寫文字</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script src="./starText.js"></script>
</head>
<body>
    <div id="textdiv"></div>
    <script>
    $(function(){
        var text = "我的益達我的益達我的益達我的益達我的益達 我的益達我的益達我的益達我的益達吃";
        var textdiv = $("#textdiv");
        var index = 0;
        textdiv.starText(0,textdiv,text);
        
    });
        

    </script>
    


</body>
</html>


        $.fn.starText=function(index,textdiv,text){
            var length = text.length;
            var Timer = setInterval(function(){
            
            if(index>=length){
                clearInterval(Timer);
            }
            textdiv.html("");
            var myText = text.substring(0,index+1);
            console.log("myText-----------"+myText);
            var regText = /\s+/g;
            if(regText.test(myText)){
                myText = myText.replace(regText,"<br/>");
                index++;
            }
            
            textdiv.html(textdiv.html()+myText);
            console.log(textdiv.html());
            index++;
            console.log(index);

        },100);

        }