如何通过JavaScript / HTML中的文本框显示用户输入的文本

时间:2011-11-08 21:28:39

标签: javascript html textbox user-input alert

我目前在我的JavaScript代码中有这个:

<html>
<head>
    <title>
        Form
    </title>

<script type="text/javascript">

var input = document.getElementById('textbox');
         function namet()
        {
        alert(textbox.value);
        }


    var input2 = document.getElementById('location');   
        function namet2()
        {
        alert(location.value);
        }
 </script> 


    </head>

 <body>

 Your name: 
 <input type="text" name="FirstName" id="textbox" <br><br/> 

 Your Address:
 <input type="text" name="address" id="location" <br></br>

 click:
 <input type="button" value="submit" onclick="namet()"/>

 </body>
 </html>

...并且正在寻找一种方法来收集用户在文本框中输入的内容,并在他们点击“点击”按钮时将其显示在单个警告框中,有点像确认。

此外,在警告框中单击“确定”后,了解如何将它们重定向到其他页面也很有帮助。

谢谢。

3 个答案:

答案 0 :(得分:4)

这很容易实现,你几乎拥有它!只是一些错误的变量......

根据您给出的示例,更改:

7 <script type="text/javascript">
8   
9   var input = document.getElementById('textbox');
10       function namet()
11      {
12      alert(textbox.value);
13      }
14      
15      
16  var input2 = document.getElementById('location');   
17      function namet2()
18      {
19      alert(location.value);
20      }
21 </script>

为:

7 <script type="text/javascript">
8   
9   var textbox = document.getElementById('textbox');
10       function namet()
11      {
12      alert(textbox.value);
13      }
14      
15      
16  var location = document.getElementById('location');   
17      function namet2()
18      {
19      alert(location.value);
20      }
21 </script> 

希望有所帮助。

- 根据评论进行编辑 -

将两个单独的函数合二为一,然后在函数内部设置变量,如下所示:

<script type="text/javascript">
function showConfirmationDialog() {
    var textbox = document.getElementById('textbox');
    var location = document.getElementById('location');
    alert(textbox.value + '\n' + location.value);
}
</script>

...

<input type="button" value="submit" onclick="showConfirmationDialog();" />

- 重新编辑:就像一个白痴,忘记了.value ......修复了。

答案 1 :(得分:0)

请使用以下代码:

 <script type="text/javascript">
    function namet() {
      var input = document.getElementById("textbox").value;
      var input2 = document.getElementById("location").value;   
      alert( "Name : " +input+" Location : " +input2);
      window.location.assign("anypage.html")
    }
 </script> 

答案 2 :(得分:-2)

使用jquery

$(document).ready(function(){
   $("form").submit(function() {
   var fname = $('#fname').val();
   var lname = $('#lname').val();
   alert("First Name:"fname\n"Last Name:"lname);
   });
});

和表格

<form>
<input type="text" name="fname" id="fname" />
<input type="text" name="lname" id="lname" />
<input type="submit" value="submit" />
</form>

希望这有帮助