php/js 从 js 表单发布数据答案

【问题标题】：php/js post data from js formphp/js 从 js 表单发布数据
【发布时间】：2012-04-24 20:20:37
【问题描述】：

我正在使用 javascript，它允许用户从下拉列表中选择项目并将其移动到文本区域框中。完成后，我想将他们的选择发布到服务器。问题是 javascript 写入的文本区域本身就是一个表单。由于我的理解是一个表单不能嵌套在另一个表单中，我不确定如何获取所选数据以发布它。任何建议都非常感谢。代码如下：

<html>
<head>
<script type="text/JavaScript">
function showText(){
var F, opt;
F = document.oForm;
opt = F.oSel.options;
if (F.oTxt.value!="")
F.oTxt.value += '\n';
F.oTxt.value += opt[opt.selectedIndex].text;
}

</script>
</head>
<body>
<form name="oForm">
<select name="oSel" size="3"
onchange="showText()">
<option>item1</option>
<option>item2</option>
<option>item3</option>
<option>item4</option>
</select>
<textarea name="oTxt" cols=24 rows=4>
</textarea>
</form>
</body>
</html>

【问题讨论】：

标签： javascript forms post textarea

【解决方案1】：

给 textarea 一个 id (<textarea id="oTxt" ..>) 然后使用 document.getElementById('oTxt') 引用它。

或者，您可能想要检查选择多个（将 multiple 属性添加到您的 <select> 标记），它已经为您正在做的事情而设计。

【讨论】：

我一直在尝试这种替代方法，以便用户在发布之前可以看到他们的选择。理想情况下，我会选择一个允许多项选择的单行选择框，但设置 size=1 会将选择限制为第一个选项。在使用 id 时，我是否使用 get elementByID 引用在现有表单之外创建一个新表单？
如果您真的想要单独预览，我会取消 <textarea> 并使用列表 (<ul id="preview-list">) 和隐藏的输入标签来存储实际值（或将它们存储在如果您想使用 AJAX 提交，则为全局 JavaScript 变量。）将每个选择添加到该列表中作为子 <li> 标记。 JQuery 使这种修改变得非常容易：$('ul#preview-list').append( $('<li>'+selectionValue+'</li>') ); 然后使用 CSS 为该列表设置任何您想要的样式。
为什么需要单独的<form>，是单独提交的吗？像 textarea 这样的输入元素在表单之外工作，它们只是无法提交。（如果您只需要表单按名称访问元素，则使用 id 替换它。）
请原谅我对 javascript 的了解不足。数据必须发布到由 php 处理的服务器，放置在 dbase 等中。在发布到服务器之前，js 似乎提供了一个改进的用户体验查看他们正在组装的列表，而不是使用 html 下拉列表中的 ctrl 单击将其发布到服务器。 textarea 没有什么特别之处——很乐意收集一份他们可以查看的列表。一旦他们对它进行了微调，只需要将组装好的列表发布到服务器即可。大概这需要一个单独的表单，即可以访问列表的 action=procdata.php。
然后将值存储在由 id (document.getElementById(...).value = ...) 引用的隐藏字段 (<input type="hidden" name="..." value="..." id="...">) 中。提交表单时，将包含隐藏字段。由于它不可见，因此您可以使用任何您想要的预览结构。