`

jquery的ajax实现加法操作

    博客分类:
  • ajax
 
阅读更多

jsp代码

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	
	<script type="text/javascript" src="<c:url value='/jquery/jquery-1.4.2.js'></c:url>"></script>
	
	<script type="text/javascript">
		$(function()
		{
			$("#button1").click(function()
			{
				$.ajax({
					
					type:"POST",
					url:"MyServlet",
					dateType:"html",
					data:{'param1':$("#param1").val(), 'param2':$("#param2").val()},
					success:function(returnedData){
						$("#result").val(returnedData);
					}
				});
			})
		
		});
	
	</script>
	
  </head>
  
  <body>
  <input type="text" id="param1">+
  <input type="text" id="param2">=
  <input type="text" id="result"><input type="button" id="button1" value="请点击">
  </body>
</html>

 

servlet代码

package com.javasky.servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;



public class MyServlet extends HttpServlet 
{
	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException 
	{
		System.out.println(req.getParameter("param1"));
		System.out.println(req.getParameter("param2"));
		int param1 = Integer.parseInt(req.getParameter("param1"));
		int param2 = Integer.parseInt(req.getParameter("param2"));
		
		resp.setHeader("param", "no-cache");
		resp.setHeader("cache-control","no-cache");
		
		
		
		
		PrintWriter out = resp.getWriter();
		out.println(String.valueOf(param1+param2));
		out.flush();
	
	}
	
	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		this.doPost(req, resp);
	}
	
}

  

分享到:
评论

相关推荐

    Jquery Ajax实现简易计算器

    在本文中,我们将深入探讨如何使用Jquery Ajax技术来实现一个简易计算器。Ajax(Asynchronous JavaScript and XML)是一种在不刷新整个页面的情况下与服务器交换数据并更新部分网页的技术。结合Jquery库,我们可以...

    AJAX之加法运算示例(asp.net)

    本示例以"AJAX之加法运算示例(asp.net)"为主题,旨在帮助初学者理解如何在ASP.NET环境中利用AJAX实现简单的加法运算,提升用户体验。 首先,我们需要了解ASP.NET是微软提供的一个强大的Web应用程序框架,它简化了...

    asp ajax post 实现整数加法过程

    "asp ajax post 实现整数加法过程"这个主题涉及了如何利用Ajax和POST方法在后台执行整数加法操作,并将结果实时返回到前端。下面将详细介绍这一过程。 首先,我们需要理解Ajax的基本工作原理。Ajax允许前端...

    Ajax简单计算器

    也是朋友要的一个小小的演示,用了最简单的代码来实现一个Ajax的计算器,只能运算加法,有兴趣的朋友拿去试试完善他吧!有心学简单的提示足够让你学会他,无心学给你写再好的代码也没用,这就是我写Demo的原则!

    jQuery精美的加减乘除计算器 支持存储功能

    例如,加法操作可以通过以下方式实现: ```javascript $("#add").click(function() { // 获取当前显示的数值并进行加法运算 var currentValue = parseFloat($("#display").text()); var addedValue = parseFloat...

    jQuery实现的彩色计算器功能特效源码.zip

    同时,需要注意的是,为了实现正确的计算顺序,我们需要理解并实现BODMAS(括号、指数、除法和乘法、加法和减法)规则。 接着,计算器的动画特效是提升用户体验的重要部分。jQuery提供了丰富的动画方法,如`.fadeIn...

    jquery-mini-counter-

    首先,jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画效果以及Ajax交互。在`jquery-mini-counter-`项目中,jQuery被用来处理用户输入和展示计算结果。通过选择器,我们可以轻松地获取HTML...

    javascript/jquery 的md5加密插件

    jQuery是一个流行的JavaScript库,它简化了DOM操作和事件处理,但不包含MD5加密功能。通过这个插件,我们可以结合jQuery的强大功能与MD5加密,为用户提供更安全的服务。 MD5的工作原理是将输入的数据分块处理,然后...

    jQuery实现的简单在线计算器功能

    jQuery是一个强大的JavaScript库,简化了DOM操作、事件处理和Ajax交互等任务。 2. **DOM元素选择**:jQuery的选择器是其核心功能之一。例如,`$("form div input:text")`选取了表单内所有div内的文本输入框。`$("#...

    jQuery随机数字运算验证码.zip

    这个“jQuery随机数字运算验证码”是一个使用jQuery库实现的特定功能,它结合了JavaScript和ECMAScript的技术来生成含有数学运算的随机数字验证码。下面将详细解释相关知识点。 1. jQuery库:jQuery是一个轻量级、...

    c#编写的ajax入门程序

    Ajax操作主要通过JavaScript实现,这里我们使用了流行的jQuery库,它简化了Ajax请求的编写。在HTML页面中引入jQuery库后,可以使用`.ajax()`方法发送异步请求: ```javascript $.ajax({ type: "POST", url: ...

    jQuery立体质感科学计算器代码

    总的来说,这两款jQuery立体质感科学计算器代码的实现,不仅展示了jQuery在DOM操作和事件处理上的强大能力,还体现了CSS3在提升网页交互设计上的重要作用。无论是对于初学者还是有经验的开发者,都能从中学习到如何...

    jQuery随机数字运算验证码代码.zip

    jQuery是一个高效、简洁的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互。在这个项目中,jQuery主要用于操作DOM(文档对象模型)元素,以及创建动态的验证码效果。 在`index.html`文件中,我们...

    jQuery购物车自动计算金额表单.zip

    在前端开发中,jQuery是一个非常流行的JavaScript库,它简化了DOM操作、事件处理、动画以及Ajax交互等任务。本项目“jQuery购物车自动计算金额表单”是针对电商网站购物车功能的一个实例,旨在实现用户在添加商品到...

    jQuery计算器带操作记录特效代码

    jQuery计算器带操作记录特效代码是一种基于JavaScript库...通过学习和研究这个代码,开发者不仅可以提升在jQuery上的技能,还可以了解到如何实现操作记录这一特性,这对于构建更复杂、功能丰富的Web应用是很有帮助的。

    jQuery实现input数字加减特效代码

    首先,jQuery是一个强大的JavaScript库,它简化了DOM操作、事件处理和AJAX交互等任务。在本项目中,jQuery将用于监听按钮的点击事件,并根据用户的选择更新input元素的值。使用jQuery,我们可以编写简洁的代码来实现...

    5款实用的jQuery验证码插件.zip

    jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画制作以及Ajax交互等任务。验证码插件则是利用jQuery增强用户体验并保护网站免受自动脚本攻击的有效方式。 标题"5款实用的jQuery验证码插件....

    js实现简单计算器

    在标签中提到了"jQuery库",jQuery是一个流行的JavaScript库,它简化了DOM操作、事件处理、动画和Ajax交互。虽然在这个项目中没有直接使用jQuery,但在更复杂的计算器实现中,jQuery可以帮助简化代码,例如通过`$...

    jquery-ui-game:使用 HTML5、CSS3、JQuery 和 jQuery UI 开发的简单交互游戏

    jQuery 是一个轻量级的 JavaScript 库,简化了 DOM 操作、事件处理、动画制作和Ajax交互。在“绿色数学”游戏中,jQuery 被用来处理用户与游戏元素的交互,如点击按钮、输入答案、验证结果等。它还可能用于实现平滑...

Global site tag (gtag.js) - Google Analytics