Question

我似乎在这里做错了什么。此脚本适用于已注释掉但不包含文本框的提示。我是否以某种方式未能将输入值发送给函数？

我也在if语句中使用正则表达式时遇到问题，而不是一个笨拙的标点符号列表。

<html>
<head>
</head>
<body>
<div id="myTypingText"></div>
<label>Say what you want typed</label> 
<input class="textBox" id="userInput" />
<label>A pregnant pause... (300?)</label>
<input type="number" id="userBreath" />
<button onclick="printLooper()" href="javascript:;">Submit</button>
<! --input name="buttonExecute" onclick="execute(document.getElementById('textbox1').value)" type="button" value="Execute" --/>
<script type="text/javascript" language="javascript">
var myString = document.getElementById('userInput').value;
//var myString = prompt('Say what you want to see typed','Right here, baby'); //prompts are annoying, i know
//var myDelay = prompt('Type speed (try 50)', 'The higher the number, the slower it types');
//var myBreath = prompt('Now tell me how long to pause at each breath (shift+2)', 'Try 300')
var myBreath = document.getElementById('userBreath').value;
var myArray = myString.split("");
var loopTimer;

function printLooper(){
  if(myArray.length > 0 ){
      var char = myArray.shift();
      if ( char === '@'){
          document.getElementById("myTypingText").innerHTML
      }else {
      document.getElementById("myTypingText").innerHTML += char;
      }
  } else {
    clearTimeout(loopTimer);
  }
  if (char === ' '){
  loopTimer = setTimeout('printLooper()', 20);
  } else if (char === ',' || char === '.' || char === '?') {
  loopTimer = setTimeout('printLooper()', 220); //fiddle with these 2nd params as you see fit
  } else if (char === '@'){
  loopTimer = setTimeout('printLooper()', myBreath);
  } else {
  loopTimer = setTimeout('printLooper()', 47);
  }
}
printLooper(); 

</script>
</body>
</html>

任何帮助表示赞赏！

Answer 1

你需要在你的函数中包含一些变量。

我做了一个演示并删除了按钮上的内嵌js。如果有用，请使用此选项：

<button id="sub_btn">Submit</button>


var loopTimer;
var char, myString, myBreath, myArray;

function printLooper() {
    if (myArray.length > 0) {
        char = myArray.shift();
        console.log(char);
        if (char === '@') {
            document.getElementById("myTypingText").innerHTML = '';
        } else {
            document.getElementById("myTypingText").innerHTML += char;
        }
    } else {
        clearTimeout(loopTimer);
        return false; // To the loop will stop when the array is empty
    }
    if (char === ' ') {
        loopTimer = setTimeout(printLooper, 20);
    } else if (char === ',' || char === '.' || char === '?') {
        loopTimer = setTimeout(printLooper, 220); //fiddle with these 2nd params as you see fit
    } else if (char === '@') {
        loopTimer = setTimeout(printLooper, myBreath);
    } else {
        loopTimer = setTimeout(printLooper, 47);
    }
}
document.getElementById('sub_btn').onclick = function () {
    myString = document.getElementById('userInput').value;
    myBreath = document.getElementById('userBreath').value;
    myArray = myString.split("");
    printLooper(myString, myBreath, myArray);
};

演示here

Answer 2

您应该将这些行放在函数

中

var myString = document.getElementById('userInput').value;
var myBreath = document.getElementById('userBreath').value;
var myArray = myString.split("");

它是空的，因为你把它放在函数之外，最初输入是空的，函数if(myArray.length > 0 )内部总是假的，你需要在按下按钮后调用函数时填充数组，同时{{ 1}}不是按钮的有效属性，因为另一个答案说明了它。

Answer 3

这种语法有额外的字符，你可能在那里打字错误。我之前从未见过带有href属性的按钮元素，但我没有得到太多。你可能想重温这个。

<button onclick="printLooper()" href="javascript:;">Submit</button>

Answer 4

var myString = document.getElementById('userInput').value;
//var myString = prompt('Say what you want to see typed','Right here, baby'); //prompts are annoying, i know
//var myDelay = prompt('Type speed (try 50)', 'The higher the number, the slower it types');
//var myBreath = prompt('Now tell me how long to pause at each breath (shift+2)', 'Try 300')
var myBreath = document.getElementById('userBreath').value;
var myArray = myString.split("");

将这些移动到函数内部。

如何将文本框值发送到javascript函数？

4 个答案:

演示here