0

我要解决的问题是有一个 javascript 函数,它将按顺序执行一些函数。

步骤 1) Web 客户端/javascript 在浏览器本地执行一些功能。

步骤 2) 浏览器调用 web 服务器上的 java 类/应用程序,它将执行一些只有 web 服务器本身(而不是客户端)才能执行的任务。

第 3 步)将第 2 步的结果添加到网页并显示在浏览器中,而无需重新加载所有 HTML

NB 步骤 2 可能需要几分钟,在此期间客户端基本上处于非活动状态是可以的。

我很感激任何可能相关的建议或演练/教程。

亲切的问候

4

2 回答 2

0

Use jQuery to perform an asynchronous HTTP request(AJAX)

function YOURFUNCTION(){
//Calls servlet
$.post('ServletName',{parameter:value,parameter2:value2,...},function(results) {
  //displays results returned from servlet in specific div(resultsDiv)
  $('#resultsDiv').html(results);
});

}

You need to include the jQuery library on top of your HTML file as:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

You may find more info here

Simple as that.

于 2013-06-13T14:12:46.037 回答
0

我希望这个简洁的解释能给你一个概述和你期望的理解。

第一部分

服务器端

在您服务器上的 Web 服务器应用程序中,如果使用 Java,您将创建一个 Java servlet 类来处理从客户端浏览器通过脚本或表单提交的数据,并提供动态内容,例如来自客户端的数据库查询结果.

阅读更多关于 Servlet 的信息:

  1. http://docs.oracle.com/javaee/5/tutorial/doc/bnafe.html
  2. http://en.wikipedia.org/wiki/Java_Servlet
  3. 什么是 Java Servlet?

另请阅读有关如何在服务器上注册 servlet 的更多信息(java 项目的 web.xml)

servlet 示例:

-=================-

@WebServlet(name = "MyServlet", urlPatterns = {"/calculator"}, asyncSupported = true)
public class MyServlet extends HttpServlet {

@Override
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    Enumeration e = request.getParameterNames(); // parsing the string from client

    while (e.hasMoreElements()) {
        String name = (String) e.nextElement();// eg. "command" from ajax
        String value = request.getParameter(name); // eg. getSum

        if (value.equals("getSum")) {
            // Instantiate a java class and call the method
            // that performs the addition and returns the value
            Calculator calc = new Calculator();

            String answer = (String) calc.getSum();

            if (answer != null) {
                // Set contentType of response to client or browser
                // so that jQuery knows what to expect.
                response.setContentType("text/plain");
                PrintWriter out = response.getWriter();
                // return answer to ajax calling method in browser
                out.print(answer); 
                out.close();
            }
        }
    } // END While LOOP


}

@Override
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // include method if you call POST in you ajax on client side
}

}

用于计算服务器路径的 Java 类

public class Calculator {
    public int getSum() {
        return 10+15;
    }
}

-

B部分

客户端——您的浏览器

-=======================-

您必须访问 jQuery 网站,下载并添加 jQuery ajax 脚本到您的项目中。“jquery-ui.min.js”足以满足此目的。使用以下行将此脚本添加到您的 html 或 jsp 文件中:

 <script src="resources/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>

在您的外部 javascript 文件或内联 javascript 中包含一个调用 servlet 并获取总和的函数,如下所示:

function getSum(){
    $.ajax({
        type: 'GET',       //  type of request to make. method doGet of the Servlet will execute
        dataType: 'text',  // specifying the type of data you're expecting back from the server
        url: 'calculator', // the URL to send the request to. see annotation before class declaration
        data: "command="+"getSum", // Data to be sent to the server (query string)

        // if request fails this method executes
        error: 
        function(e){
            alert('Error. Unable to get response from server');
        },

        // when request is successful, this function executes
        // display the data from server in an alert
        success: 
            function(result){
                if(result) {
                    alert(result);
                }
            }    

   });
}
于 2013-06-13T16:08:04.450 回答