<%--

  Created by IntelliJ IDEA.

  User: Administrator

  Date: 2021/3/13

  Time: 14:54

  To change this template use File | Settings | File Templates.

--%>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<html>

  <head>

    <title>$Title$</title>

    <script type="text/javascript" src="js/jquery-3.4.1.js"></script>

    <script type="text/javascript">

      $(function () {

        $("#pBtn").click(function () {

          var pid = $("#pid").val();

          $.ajax(

                  {

                    url:"search",

                    type:"get",

                    data:{

                      "pid":pid

                    },

                    dataType:"json",

                    success:function (resp) {

                      //resp是json对象

                      $("#pname").val(resp.name);

                      $("#pjiancheng").val(resp.jiancheng);

                      $("#pshenghui").val(resp.shenghui);

                    }

                  }

          )

        });

        })

    </script>

  </head>

  <body>

    <table border="1">

      <tr>

        <td>城市编号：</td>

        <td><input type="text" id="pid"> <input type="button" id="pBtn" value="搜索"></td>

      </tr>

      <tr>

        <td>城市名称：</td>

        <td><input type="text" id="pname"></td>

      </tr>

      <tr>

        <td>简称：</td>

        <td><input type="text" id="pjiancheng"></td>

      </tr>

      <tr>

        <td>省会：</td>

        <td><input type="text" id="pshenghui"></td>

      </tr>

    </table>

  </body>

</html>

　　

package com.demo.controller;

import com.demo.dao.ProvinceDao;

import com.demo.entity.Province;

import com.fasterxml.jackson.databind.ObjectMapper;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import java.io.IOException;

import java.io.PrintWriter;

public class SearchServlet extends HttpServlet {

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        String pid = request.getParameter("pid");

        Province p = null;

        if (pid != null  && !"".equals(pid)){

            ProvinceDao dao = new ProvinceDao();

            p = dao.getProvinceById(Integer.valueOf(pid));

        }

        ObjectMapper om = new ObjectMapper();

        String jsonStr = om.writeValueAsString(p);

        response.setContentType("application/json;charset=utf-8");

        PrintWriter out = response.getWriter();

        out.print(jsonStr);

    }

}

　　

使用jQuery实现ajax请求的更多相关文章

  1. jQuery发送ajax请求

    利用jquery发送ajax请求的几个模板代码. $.ajax({ async : false, type: 'POST', dataType : "json", url: &qu ...

  2. JQuery发送ajax请求不能用数组作为参数

    JQuery发送ajax请求不能用数组作为参数,否则会接收不到参数, 一.js代码如下: $('#delete-button').click(function(){        var select ...

  3. Angular和jQuery的ajax请求的差别

    近期项目中使用angular,结果发现后台没法获取參数,所以,略微研究了一下两者在发送ajax时的差别. 注意angular和jquery的ajax请求是不同的. 在jquery中,官方文档解释con ...

  4. Jquery发送ajax请求以及datatype参数为text/JSON方式

    Jquery发送ajax请求以及datatype参数为text/JSON方式 1.方式一:datatype:'text' 2.方式二:datatype:'JSON' 3.使用gson-1.5.jar包 ...

  5. 使用es6的then()方法封装jquery的ajax请求

    使用场景: jsp页面中使用jquery的ajax请求比较频繁,以前vue框架的项目用过axios,所以就想着用then()封装一个公共请求的方法,这样每次请求就不用那么麻烦的写一大堆请求参数了. 示 ...

  6. 如何终止JQUERY的$.AJAX请求

    最近遇到,如果用户频繁点击ajax请求,有两个问题: 1,如果连续点击了5个ajax请求,前4个其实是无效的,趁早结束节省资源. 2,更严重的问题是:最后一个发送的请求,响应未必是最后一个,有可能造成 ...

  7. jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法

    jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...

  8. jQuery发送Ajax请求以及出现的问题

    普通jQuery的Ajax请求代码如下: $.ajax({ type: 'POST', url: "http://xxx/yyy/zzz/sendVerifyCode", data ...

  9. Sping MVC不使用任何注解处理（jQuery）Ajax请求（基于XML配置）

    1. Spring Spring框架是一个轻量级的解决方案,是一个潜在的一站式商店,用于构建企业就绪的应用程序.Spring框架是一个Java平台,为开发Java应用程序提供全面的基础架构支持.Spr ...

  10. Struts2处理（jQuery）Ajax请求

    1. Ajax     Ajax(Asynchronous JavaScript and XML,异步JavaScript和XML)时一种创建交互式网页应用的网页开发技术,它并不是一项新的技术,其产生 ...

随机推荐

  1. HBuilderX All In One

    HBuilderX All In One uni-app https://uniapp.dcloud.io/quickstart-hx 目录结构 一个uni-app工程,默认包含如下目录及文件: $ ...

  2. iPadOS 14 memoji 无法使用 bug

    iPadOS 14 memoji 无法使用 bug iPadOS 14 bug refs 如何在 iPhone 和 iPad Pro 上使用动话表情 https://support.apple.com ...

  3. MongoDB Manually config

    MongoDB Manually config macOS 10.15.x path error exception in initAndListen: NonExistentPath: Data d ...

  4. node.js & read argv

    node.js & read argv https://nodejs.org/docs/latest/api/process.html https://flaviocopes.com/node ...

  5. webpack 4 & dev server

    webpack 4 & dev server proxy https://webpack.js.org/configuration/dev-server/#devserverproxy htt ...

  6. Linux & bash & tcpdump

    Linux & bash & tcpdump Linux & tcpdump https://www.tecmint.com/12-tcpdump-commands-a-net ...

  7. how to export svg form web page in js

    how to export svg form web page in js https://stackoverflow.com/questions/2483919/how-to-save-svg-ca ...

  8. Nestjs 验证对象数组

    route @Patch(':id') patch(@Param('id') id: string, @Body() removeEssayDto: RemoveEssayDto) { return ...

  9. 揭秘高倍矿币 Baccarat BGV，为何NGK DeFi的财富效应如此神奇？

    作为区块链4.0代表的NGK公链,这次也将借助它自己的DeFi版块NGK Baccarat,开启属于它自己的千倍财富之旅. 如果说,比特币能让没有银行账户的人,可以在全球任何时间.地点都能自由进行交易 ...

  10. std::unordered_map与std::map

    前者查找更快.后者自动排序,并可指定排序方式. 资料参考: https://blog.csdn.net/photon222/article/details/102947597