3

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

我也无法在 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>

任何帮助表示赞赏！

4

4 回答 4

2

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

我做了一个demo，去掉了按钮上的内联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);
};

演示在这里

于 2013-09-14T20:45:49.897 回答
0

您应该将这些行放在函数中

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

它是空的，因为你把它放在函数之外，最初输入是空的，函数内部if(myArray.length > 0 )总是假的，一旦按下按钮后调用函数，你需要填充数组，也不href是按钮的有效属性作为另一个答案陈述它。

于 2013-09-14T20:39:03.587 回答
0

此语法有额外的字符，您可能在其中拼写错误。我以前也从未见过带有 href 属性的按钮元素，但我没有得到太多。你可能想重新审视这个。

<button onclick="printLooper()" href="javascript:;">Submit</button>
于 2013-09-14T20:41:01.327 回答
0 
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("");

将这些移动到函数内部。

于 2013-09-14T20:46:55.540 回答