Question

嗯，我有一个提交按钮的页面。单击提交按钮时，页面将转移到下一页（即servlet页面）。但我希望表单页面内容（即所有属性和值）应该转移到servlet页面而不是整个页面（即它应该在单击提交按钮后在表单页面上）。这是针对使用jQuery Mobile框架的移动设备

我认为它需要一些javascript编码。

谢谢和问候， Vineet M

Answer 1

使用ajax帖子将为您提供所需的功能，我建议使用jquery，因为它使事情变得更容易。

http://api.jquery.com/jQuery.post/

来自jquery的例子

   <!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <form action="/" id="searchForm">
   <input type="text" name="s" placeholder="Search..." />
   <input type="submit" value="Search" />
  </form>
  <!-- the result of the search will be rendered inside this div -->
  <div id="result"></div>

<script>
  /* attach a submit handler to the form */
  $("#searchForm").submit(function(event) {

    /* stop form from submitting normally */
    event.preventDefault(); 

    /* get some values from elements on the page: */
    var $form = $( this ),
        term = $form.find( 'input[name="s"]' ).val(),
        url = $form.attr( 'action' );

    /* Send the data using post and put the results in a div */
    $.post( url, { s: term },
      function( data ) {
          var content = $( data ).find( '#content' );
          $( "#result" ).empty().append( content );
      }
    );
  });
</script>

</body>

Answer 2

听起来你想要的是AJAX或发布到同一个文件。

您可以在这里学习一个教程，它将引导您通过原始javascript中的AJAX表单：http://www.tizag.com/ajaxTutorial/ajaxform.php

一旦你明白了，就可以通过jQuery库/框架（如jQuery）轻松执行AJAX。

要发布到同一文件，您的表单操作将是同一页面。使用您正在使用的任何语言的服务器将在处理完数据后返回相同的页面。

Answer 3

你可以在这里采取两种方法。

第一个非常快速和脏：您将表单提交到servlet页面，该页面接收表单值，然后立即将用户弹回表单。

第二种方式，正确的方式是AJAX。使用javascript撰写一个你发起的HTTP请求，它在后台完成，而无需用户进一步查看。 Here's a good introduction

尽管如此，请谨慎使用 - 您需要注意您的用户界面，让用户知道过程中每个阶段发生了什么（或出现了什么问题）。它是一个强大的工具，权力是责任。 ;）

提交不应转移到下一页

3 个答案: