当前位置：文江博客话题详情

提交表格时留在同一地点

发布于 2024-12-05 19:25:41 字数 59 浏览 0 评论 0原文

当我提交表单时，页面将导航到页面开头。

我想留在同一个位置。有什么方法可以做到这一点吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

绮筵 2024-12-12 19:25:41

是的，不使用表单提交，而是使用 XHR 在 JavaScript 中发送异步请求。举一个具体的例子，假设您有一个简单的表单，如下所示：

<form method="POST" action="/path/to/submit">
  <input id="input_name" name="input_name" type="text" value="value" />
</form>

使用 XHR，它可能如下所示（使用 XHR 的闭包库）：

<script>
  goog.require('goog.net.XhrIo');
  var submitCompleted = function() {
     alert('Submitted!');
  };

  var submitAction = function() {
     var value = document.getElementById('input_name').value;
     goog.net.XhrIo.send(
       '/path/to/submit',
        submitCompleted,
       'POST',
       'input_name=' + encodeURIComponent(value));
  };
</script>

我假设您仍然保留与以前相同的输入元素，但您将 onsubmit 函数定义为调用submitAction 而不是使用表单的默认提交行为。

Yes, instead of using the form submission, send an asynchronous request in JavaScript using XHR. To give a concrete example, suppose you have a simple form that looks like:

<form method="POST" action="/path/to/submit">
  <input id="input_name" name="input_name" type="text" value="value" />
</form>

Using XHR, it might look something like the following (using the Closure library for XHR):

<script>
  goog.require('goog.net.XhrIo');
  var submitCompleted = function() {
     alert('Submitted!');
  };

  var submitAction = function() {
     var value = document.getElementById('input_name').value;
     goog.net.XhrIo.send(
       '/path/to/submit',
        submitCompleted,
       'POST',
       'input_name=' + encodeURIComponent(value));
  };
</script>

I'm assuming that you still keep the same input element as before, but that you define your onsubmit function to invoke submitAction instead of using the default submission behavior of your form.

回复收藏 0 原文

~没有更多了~