textarea的值返回空

时间:2013-10-04 17:23:58

标签: javascript jquery html forms

我有一个包含textarea和提交按钮的HTML表单。以及获取textarea值的JS脚本。

我面临的问题是当我在textarea中输入文本并点击提交时,textarea值为空。但是,如果我将文本硬编码到textarea中,则返回硬编码值。如果我擦除硬编码值并删除硬编码值并输入我自己的值,仍会返回硬编码值。

HTML

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1"> 

<script src="js/jquery/jquery-1.9.1.min.js"></script>

<script src="contentForm.js"></script>
</head>

<body>
<form method="post" >
    <textarea name ="editor" id="editBox" rows="5" cols="2">type</textarea>
    <p><input type="submit" id="submit" value="Submit"></p>
 </form>
</body>
</html>

JS

    function add() {
$("#submit").click(function() {
var message = "start js";
console.log(message);

var contents = $("textarea").val();

if(contents === undefined) {
  console.log("contents undefined");
}
console.log(contents);
var item = {"id":"12", "content": contents};
var obj = JSON.stringify(item);
var obj2 = JSON.parse(obj);
console.log(obj2.id);
console.log(obj2.content);
});
}

$(document).ready(function () {

 add(); 

});

注意上面的textarea如何预先加载“type”。这是返回的值。如果我把它留空,在表单中键入我自己的文本并点击提交,控制台日志显示为内容的值为空。

我也试过这个(使用textarea id)

var contents = $("#editBox").val();

我假设问题在于POST。因为当我按Enter键时,我输入的文本被替换为“type”(预加载的文本)。

POST会干扰它吗?我怎么能去检索价值?

1 个答案:

答案 0 :(得分:0)

我不确定实际问题,但过去几天我注意到了一些奇怪的事情。在这种情况下,console.log()在Chrome中不起作用。可能是一个firebug bug?无论如何,将console.log()替换为alert并从textarea中删除了默认值。

更新了小提琴:http://jsfiddle.net/eVmQ9/2/

这似乎适用于chrome和firefox。