Question

我有关于将表单值发送到脚本的问题。我有一个表单设置，当用户按下一个按钮时，我希望表单中的值显示在页面的另一部分。我可以使用php或其他网络脚本语言轻松完成此操作，但我所知道的是如何通过以

的形式将其发送到脚本来完成此操作

有没有办法在不加载新页面的情况下执行此操作？就像在页面上显示加载覆盖一样，直到脚本完成并在页面上显示值？

我猜这可以使用Javascript或Ajax或类似的东西来完成。

如果有人可以帮助我，或者甚至只是说我应该开始寻找，我真的很感激！

Answer 1

事实上。只需将onsubmit事件监听器附加到您始终返回false的表单，以防止通过常规GET或POST请求实际发送表单。

在您的事件监听器中，您可以使用XMLHttpRequest发送表单值，并让回调函数更新页面的相关部分。

但请记住始终创建一个后备选项（使用表单的常规GET或POST请求）来处理您的表单，以防JavaScript无法使用（例如，关闭，阻止等）。

Answer 2

如果你只是希望表单中的值再次显示在页面上而不与服务器进行任何交互，那么像jQuery这样的东西将是最好的方法。

Jquery有一个很好的表单插件，您可以执行以下操作：

var form_values = $('#form_name').formHash();

form_values将是系统中表单值的散列数组，即

<form id="test">
  <input id="test1" name="test1" type="text" value="Test Text"/>
</form>

所以form_values ['test1']会在其中保存值Test Text

获得这些值后，您可以使用其他一些jquery函数在页面上显示它们，即

<div id="displayDiv"></div>

然后你的javascript可能是

for (key in form_values) {
  $('div#displayDiv').append('<div>Key: ' + key + ' Value: ' + form_values[key] + '</div>');
}

这会将您的值放在显示div

中

Answer 3

是的，AJAX将是你如何做到的。看看Tizag上的教程：http://www.tizag.com/ajaxTutorial/index.php

这将让你立刻开始。

Answer 4

这是a simple javascript ajax object。您无需加载任何库即可使用。