如何从表单获取输入/输出并将其存储在 JS 变量中？答案

【问题标题】：How do I take input/output from a form and store it in a JS variable?如何从表单获取输入/输出并将其存储在 JS 变量中？
【发布时间】：2010-04-13 11:03:11
【问题描述】：

我正在创建一个网络应用的 UI，还没有做任何后端工作。

出于测试目的，我希望我的表单能够正常工作，因此我想获取他们收到的输入并将其存储在 javascript 变量中，以便我可以使用 jQuery 访问它们。

我看过的所有内容都告诉我如何将 js 变量传递到表单中，而不是相反。

有什么想法吗？

谢谢。

【问题讨论】：

【解决方案1】：

var variable = $('#myInput').val()。或者，如果您的表单使用GET 提交，您可能需要查看the jQuery URL Parsing 插件以访问新页面上的变量。

编辑：

示例表单（应该是一个简单的文本框）：

<html>
    <body>
        <form action="#">
            <input type="text" id="myInput" name="myInput"/>
        </form>
    </body>
</html>

通过该表单，您可以使用上面的示例代码。顺便说一句，您可以在任何返回表单元素的 jQuery 选择器上使用 .val() 方法，例如$('input:text').val() 将为您获取所有文本输入字段的值（如果有多个值，则为数组）。

【讨论】：

#myInput 是什么？表单的名称，表单的“action”属性中的元素？还是具有提交按钮的“输入”的名称？
在本例中，myInput 是输入元素的 id，因此是 id 选择器#。
您能否提供一个代码示例来说明表单的外观？谢谢。附言不是想成为痛苦，但我试过了，它不起作用。
差不多了.....我正在尝试使用以下代码查看变量中的信息： var comment_box = $("
").appendTo(tag_box).css({"position":"absolute"}); var input_var = $('#comment').val();控制台.log(input_var);但无论出于何种原因，它都不会输出到 Mac 上的 Google Chrome 或 Mac 上的 Firefox (Firebug) 的控制台。有什么想法吗？
如果您的代码正是您所显示的，那么您将在输入字段中的任何内容之前加载输入的值，即 $('#comment').val()总是 ''。尝试将代码添加到表单的提交处理程序，例如$('form').submit(function() { var input = $('#comment').val(); console.log('Form value: ' + input); });

【解决方案2】：

我遇到了一个关于如何serialize a form to JSON with jQuery 的非常棒的问题，这将是一个好的开始。

您还可以查看jQuery Form 插件，它提供了 formSerialize 方法

将表单序列化为查询字符串。此方法将返回格式为：name1=value1&name2=value2
的字符串

还有一个fieldSerialize方法

将字段元素序列化为查询字符串。当您只需要序列化表单的一部分时，这很方便。此方法将返回格式为：name1=value1&name2=value2
的字符串

【讨论】：