Javascript - 用户通过HTML输入标签输入来设置一个Javascript变量？

我想在那里有一个我的屏幕上的文本框（就像我现在输入的那个），你可以输入，然后点击一个提交按钮，它会发送你在框中键入的任何内容到javascript和JavaScript打印出来。这是我的代码这是工作的部分。Javascript - 用户通过HTML输入标签输入来设置一个Javascript变量？

<html> 
<body> 
    <input type="text" id="userInput"=>give me input</input> 
    <button onclick="test()">Submit</button> 
    <script> 
     function test() 
     { 
      var userInput = document.getElementById("userInput").value; 
      document.write(userInput); 
     } 
    </script> 
</body> 
</html>

OK所以这是很好的，但可以说，我想从文本框和按钮输入，同时我在一个功能就是已经不希望重新启动功能？

感谢，杰克

来源

2013-03-09 user1836262

我真的不明白你在谈论你最后一句话是什么。我的意思是。你**已经在一个功能**和**不想重新启动**。这是什么意思？ – kidwon 2013-03-09 00:12:31

因此，如果我想用它启动一个函数，那么我的代码就可以工作，但是我希望提交按钮在一个函数已经运行的时候实质上工作。我会添加到按钮来做到这一点的属性？当前启动“test（）”函数将不起作用，因为我不想启动该功能。 – user1836262 2013-03-09 00:15:14

你的意思是你想要一个循环等待输入的函数吗？这不能在JavaScript中工作。除此之外，您可以随时随地使用'document.getElementById（“userInput”）.value'。 – Dave 2013-03-09 00:20:16

脚本运行时，它会阻止页面执行任何操作。您可以解决这两种方法之一：

使用var foo = prompt("Give me input");，这将给你的字符串，用户进入一个弹出框（或null如果他们取消）
拆分代码为两个函数 - 运行一个函数来设置用户界面，然后提供第二个函数作为当用户单击按钮时运行的回调函数。

来源

2013-03-09 00:27:50 Dennis

谢谢，我会把它分成2个功能 – user1836262 2013-03-09 00:30:04

这是坏的风格，但我会假设你有一个很好的理由这样做类似的东西。

<html> 
<body> 
    <input type="text" id="userInput">give me input</input> 
    <button id="submitter">Submit</button> 
    <div id="output"></div> 
    <script> 
     var didClickIt = false; 
     document.getElementById("submitter").addEventListener("click",function(){ 
      // same as onclick, keeps the JS and HTML separate 
      didClickIt = true; 
     }); 

     setInterval(function(){ 
      // this is the closest you get to an infinite loop in JavaScript 
      if(didClickIt) { 
       didClickIt = false; 
       // document.write causes silly problems, do this instead (or better yet, use a library like jQuery to do this stuff for you) 
       var o=document.getElementById("output"),v=document.getElementById("userInput").value; 
       if(o.textContent!==undefined){ 
        o.textContent=v; 
       }else{ 
        o.innerText=v; 
       } 
      } 
     },500); 
    </script> 
</body> 
</html>

来源

2013-03-09 00:26:39 Dave

为什么它的风格不好？ – user1836262 2013-03-09 17:58:55

当它是事件驱动的时候，Javascript的效果最好，而不是一个单一的全部循环。如果事情按特定顺序发生并且您没有其他方式执行该操作，那么您只应该这样做。 – Dave 2013-03-09 18:26:57

晚读这篇文章，但.. 我看了你的问题的样子，你只需要改变两行代码：

接受用户的输入，功能回写在屏幕上。

<input type="text" id="userInput"=> give me input</input> 
<button onclick="test()">Submit</button> 

<!-- add this line for function to write into --> 
<p id="demo"></p> 

<script type="text/javascript"> 
function test(){ 
    var userInput = document.getElementById("userInput").value; 
    document.getElementById("demo").innerHTML = userInput; 
} 
</script>

来源

2014-09-24 19:36:38 new2

Javascript - 用户通过HTML输入标签输入来设置一个Javascript变量？

回答

相关问题