1

我写了以下应该打开一个文本区域，让用户输入数据，将数据捕获到一个名为 var 的变量中，然后显示一个按钮，上面写着“单击此处”，单击后将 var + 写入屏幕“我做的”。但是，我还不知道如何允许用户输入他的数据。当 textarea 出现时，没有额外的按钮可以单击，并且只要我在 textarea 中单击以写入我刚刚获得的数据，就会写入屏幕，nullidit，就好像脚本将我的 textarea 视为按钮本身一样。显然我不明白如何允许用户输入他的数据并点击额外的按钮来表示数据输入已经结束。有人可以解释一下。

<!DOCTYPE html>
<html>
<head>
        <script src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script>
function getText() {
    var str=document.getElementById("txtArea");
document.write(str + "i did it");
}
</script>
</head>
<body>
<textarea rows="5" cols="30" id = "txtArea> </textarea>
<input type = "button" value="click here" onclick = "getText();" />
  </body>
  </html>
4

4 回答 4

1

您必须从 textarea 中提取值，这是工作示例：http: //jsfiddle.net/4jH8s/

代码：

function getText() {
  var area = document.getElementById("txtArea");
  str = area.value // here we got value
  alert(str + " i did it");
}
于 2013-11-14T15:47:32.493 回答
1

除了@Feanor's answer中有关使用 .value 的提示外，尝试在 id="txtArea 之后添加一个结束 " 以及引号不匹配。这将导致您的标签无法正确关闭。当浏览器尝试更正您的 html 时，这很可能会导致 onclick 成为 textarea 的一部分

此外，您没有在代码中使用 jQuery，因此可以删除 jquery 的脚本标签

最后而不是 document.write 尝试添加另一个 div 并附加到 html 中，例如

 <!DOCTYPE html>
 <html>
 <head>

<script>
function getText() {
    var str=document.getElementById("txtArea").value;
      document.getElementById('output').innerHTML +=str + " i did it";
 }
 </script>
</head>
<body>
<textarea rows="5" cols="30" id = "txtArea"> </textarea>
<input type = "button" value="click here" onclick = "getText();" />
<div id="output"></div>
</body>
</html>

因为这比使用 document.write 更好

于 2013-11-14T15:51:04.593 回答
0

尝试使用 jquery 简单、简洁、整洁的代码...

$('input').click(function() {

    var text = $('#txtArea').val();

        alert(text);

});

jsFiddle

于 2013-11-14T15:59:57.203 回答
0

如果您粘贴的代码是您正在测试的确切代码，那么您的部分问题可能是 textarea 的 id 属性上缺少双引号。此外，document.getElementById("txtArea")将返回一个对象而不是您要查找的文本值。相反，您可以使用document.getElementById("txtArea").value来获取文本值。如果您只想显示测试，您可能希望使用alert(str + "i did it")而不是document.write(str + "i did it")覆盖文档中的内容。

这是您的代码，其中包含我提到的我在 Chrome 中测试的更改。

<!DOCTYPE html>
<html>
<head>
        <script src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script>
function getText() {
    var str=document.getElementById("txtArea").value;
alert(str + "i did it");
}
</script>
</head>
<body>
<textarea rows="5" cols="30" id = "txtArea"> </textarea>
<input type = "button" value="click here" onclick = "getText();" />
</body>
</html>
于 2013-11-14T15:53:01.927 回答