jquery ajax应用

最新推荐文章于 2023-11-20 21:35:13 发布
最新推荐文章于 2023-11-20 21:35:13 发布
阅读量72 收藏
点赞数
分类专栏： jquery 文章标签： Ajax jQuery 应用服务器 JSP Java ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/czhaozhi3758/article/details/83552710
版权
1.客户端 

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>My JSP 'index.jsp' starting page</title>
    <script type="text/javascript" src="/js/jquery.js"></script>
    <script>
    //--两次编码最为保险
    function show1(div){
         var url='ajax.jsp?div='+div+'&ch_id=我是帅哥!';
          url=encodeURI(url);//一次编码处理[参数经浏览器，要编码]
	     $.ajax({
			  url:url,
			  cache: false,//默认: true,设置为 false 将不会从浏览器缓存中加载请求信息。
			  success: function(html){
			    $("#div1").html(html);
			  }
			});
    }
     function show2(div){
          var data='div='+div+'&ch_id=我是帅哥!';
           data=encodeURI(encodeURI(data));//一次编码处理[也可无需编码，后台转码就行,只支持IE]
	      $.ajax({
			   type: "POST",
			   url: "ajax.jsp",
			   cache: false,
			   data:data,
			   success: function(msg){
		      $("#div2").html(msg);
             }
            }); 
    }
      function show3(div){
	      $.ajax({
			   type: "POST",
			   url: "ajax.jsp",
			   cache: false,
			   data:{'div':div,ch_id:encodeURI(encodeURI('我是帅哥!'))},//不转码,后台进行两次转码只支持Firefox
			   success: function(msg){
		      $("#div3").html(msg);
             }
            }); 
    }
    function show4(div){
           var data='div='+div+'&ch_id=我是帅哥!';
           data=encodeURI(encodeURI(data));
	      $.ajax({
			   type: "POST",
			   url: "ajax.jsp",
			   cache: false,
			   data:data,
			   error:function(){
	            $("#div4").html("服务器出错了...");
	           },
			   success: function(msg){
		           $("#div4").html(msg);
             }
            }); 
    }
   </script>  
  </head>
  <body>
  <center>
     <input type="submit" value="形式1" onclick="show1(1)"/>
     <div id="div1"></div>
     <hr width="100%" size="1" noshade style="border:1px dashed #cccccc;"/> 
      <input type="submit" value="形式2" onclick="show2(2)"/>
     <div id="div2"></div>
     <hr width="100%" size="1" noshade style="border:1px dashed #cccccc;"/> 
     <input type="submit" value="形式3" onclick="show3(3)"/>
     <div id="div3"></div>
     <hr width="100%" size="1" noshade style="border:1px dashed #cccccc;"/> 
      <input type="submit" value="形式4" onclick="show4(4)"/>
     <div id="div4"></div>
     <hr width="100%" size="1" noshade style="border:1px dashed #cccccc;"/> 
          <hr width="100%" size="1" noshade style="border:1px dashed #cccccc;"/> 
     </center>
  </body>
</html>


2.服务器端 

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>My JSP 'ajax.jsp' starting page</title>
  </head>

  <body>
  <%
    response.setCharacterEncoding("UTF-8");
    String ch_id="";
    String div=request.getParameter("div");
    if(div.equals("1")){
	    if(request.getParameter("ch_id")!=null){
	      ch_id=request.getParameter("ch_id");
	      //ch_id = java.net.URLDecoder.decode(ch_id,"UTF-8");//两次编码处理
	      ch_id =new String((ch_id.getBytes("ISO-8859-1")),"UTF-8");//一次编码处理
	    }
	    out.print(ch_id);
  }
   if(div.equals("2")){
	    if(request.getParameter("ch_id")!=null){
	      ch_id=request.getParameter("ch_id");
	        ch_id = java.net.URLDecoder.decode(ch_id,"UTF-8");

	    }
	    out.print(ch_id);
  }
   if(div.equals("3")){
	    if(request.getParameter("ch_id")!=null){
	      ch_id=request.getParameter("ch_id");
	        //ch_id = java.net.URLDecoder.decode(ch_id,"UTF-8");
	         ch_id =new String((ch_id.getBytes("ISO-8859-1")),"UTF-8");//一次编码处理
	    }
	    out.print(ch_id);
  }
   if(div.equals("4")){
	    if(request.getParameter("ch_id")!=null){
	      ch_id=request.getParameter("ch_id");
	      ch_id = java.net.URLDecoder.decode(ch_id,"UTF-8");
	    }
	    out.print(ch_id);
  }
   %>
  </body>
</html>

czhaozhi3758
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JQuery发送AJAX请求
gcsyzy的博客
04-01 1485
JQuery发送AJAX请求的三种方式：$get()，$post()，$ajax()
用jQuery实现Ajax
m0_53698336的博客
11-01 6667
Ajax 全称“Asynchronous JavaScript and XML”，译为“异步 JavaScript 和 XML”，程序员们习惯称之为“阿贾克斯”，它并不是一种技术，而是多种技术的综合体，其中包括 JavaScript、XML、JSON、DOM、CSS、HTML 以及最重要的 XMLHttpRequest 对象。通过 Ajax 可以异步从服务器请求数据并将数据更新到网页中，整个过程不需要重载（刷新）整个网页，可以将网页的内容更快的呈现给用户。 这里的异步是指，当程序执行到 Ajax 代码时，将
jQuery Ajax 概述
程序员小白的博客
01-28 1203
jQuery Ajax 概述
jQuery 与 Ajax
Wzc0720的博客
10-28 3806
可以在不重新加载整个网页的情况下，对网页的某部分进行更新。可以在不重新加载整个网页的情况下，对网页的某部分进行更新。简单说是需要连接数据库的地方，但是连接数据库传输的信息量很少，用不着刷新整个页面，这。简单说是需要连接数据库的地方，但是连接数据库传输的信息量很少，用不着刷新整个页面，这。减轻服务器的负担，按需取数，可以最大程度的减少冗余请求和响应对服务造成的负担。减轻服务器的负担，按需取数，可以最大程度的减少冗余请求和响应对服务造成的负担。种类型的适合用 ajax，避免了属性整个页面带来的资源浪费。
jQuery Ajax 和 axios Ajax
qq_59612674的博客
11-06 2982
区别： axios是通过promise技术实现对ajax实现的一种封装，本身上来说axios就是ajax，但是ajax却不单单只是axios；jQuery也实现了对ajax技术的封装，但是jQuery主要是对原生JavaScript进行封装，封装了js三大核心要素：ECMAScript、DOM、BOM，所以说jQuery封装的ajax只是其中的一小部分，如果通过引用jQuery来进行ajax交互实在是显得有所浪费资源，因此vue中封装了axios来实现对ajax技术的单独封装。 什么是 jQuery ？
jQuery ajax应用
郭晓湉
10-12 2640
Ajax的优势： 1，宗旨：按需请求数据  减轻服务器的带宽， 2，无刷新请求，提高web性能，例如表单验证：     1，jQuery的ajax操作 jQuery封装ajax操作，通常有这几种方式： jQuery.ajax() $.get() $.post()   Load()   (1)load()  请求的是一个静态数据文件 1，url，ajax请求的地址 2，
jQuery Ajax应用
weixin_30722589的博客
12-20 56
jQuery Ajax应用 　　 本章主要了解jQuery的Ajax与传统的Ajax的区别,掌握JQuery的Ajax常用的方法与Ajax相关的函数． 详细内容，请点击jQuery Ajax应用查看： 转载于:https://www.cnblogs.com/ranfang/p/3484384.html...
Ajax基础（应用场景｜jquery实现Ajax｜注意事项｜Ajax发送json数据｜Ajax携带文件数据）
Mchen的博客
11-20 5468
AJAX翻译成中文就是“异步Javascript和XML”。即使用Javascript语言与服务器进行异步交互也是用XML进行数据传输（当然，传输的数据不只是XML，目前更多的使用Json数据）。（XML应用于Web开发的许多方面，常用于简化数据的存储和共享）AJAX不是什么新的编程语言，而是一种使用现有标准的新方法AJAX最大的优点就是不需要重新加载整个页面的情况下，可以与服务器交换数据并更新网页内容（简单来说就是，在网页前端刚输入完数据，后端其实已经验证完数据了，不需要等点击提交了）
jQuery Ajax详解
m0_61031325的博客
05-25 1635
jQuery Ajax简介： Ajax全称为：“Asynchronous JavaScript and XML”（异步 JavaScript 和 XML）。Ajax其实质是利用浏览器提供的一个特殊的对象（XMLHttpRequest）异步地向服务器发送请求，服务器返回部分数据，浏览器让你去利用这些数据对象页面做部分的更新，整个过程，页面无刷新，不打断用户的操作。 JavaScript异步编程： 异步（Asynchronous, async）是与同步（Synchronous, sync）相对...
jquery ajax json文件,jQuery ajax读取本地json文件
weixin_31746993的博客
08-05 1404
jQuery ajax读取本地json文件json文件{"first":[{"name":"张三","sex":"男"},{"name":"李四","sex":"男"},{"name":"王武","sex":"男"},{"name":"李梅","sex":"女"}]}js方法一:$.ajax({url: "ceshi.json",//json文件位置type: "GET",//请求方式为getda...
jQuery AJAX应用实例总结
01-19
本文实例总结了jQuery AJAX应用。分享给大家供大家参考，具体如下： AJAX 是指一种创建交互式网页应用的网页开发技术。 AJAX=异步JavaScript和XML（标准通用标记语言的子集）。 AJAX是一种用于创建快速动态网页的...
jQuery ajax应用总结
11-26
一、jQuery中Ajax的调用（需要引用jQuery代码库）。 方法1： 复制代码 代码如下:$.get(url, function(data) {  //deal with the data }); 方法2： 复制代码 代码如下:jQuery.post( url, [ data ], [ success(data, ...
jQueryAjax应用解析中文WORD版
07-22
资源名称：jQuery Ajax应用解析 中文WORD版内容简介：本文档主要讲述的是jQuery Ajax应用解析；jQuery确实是一个挺好的轻量级的JS框架，能帮助我们快速的开发JS应用，并在一定程度上改变了我们写Javaｓｃｒｉｐｔ...
Kettle、Spoon数据同步工具
08-03
Kettle、Spoon数据同步工具7.0版本 SQL Server、MySQL数据库jar包等
delphi教程案例项目资源
08-03
delphi教程案例项目资源
探索MATLAB替代品的API宝典：解锁编程新境界
08-03
Matlab是由MathWorks公司开发的一款高性能的数值计算和可视化软件环境。它被广泛应用于工程计算、算法开发、数据分析、可视化、仿真以及其他数学和科学领域。Matlab的核心特点是其强大的矩阵操作能力，这使得它在矩阵计算和线性代数方面非常高效。 ### Matlab的主要特点包括： 1. **矩阵操作**：Matlab的语法是基于矩阵的，这使得进行复杂的矩阵运算变得简单直观。 2. **编程语言**：Matlab拥有自己的编程语言，支持变量、控制结构（如循环和条件语句）、函数和数据结构。 3. **数值计算**：提供广泛的数值分析功能，包括傅里叶分析、数值积分、微分方程求解等。 4. **符号计算**：Matlab的Symbolic Math Toolbox支持符号运算，可以进行符号微分、积分和方程求解等。 5. **数据可视化**：Matlab提供了丰富的图形和可视化工具，可以创建二维和三维图形、图表和动画。 6. **算法开发**：用户可以利用Matlab开发和测试算法，然后将其嵌入到其他应用程序中。 7. **模型仿真**：Matlab的Simulink提供了一个交互式
2024年Android Studio版本推荐版本Android Studio 4.2.1(202.7351085)
08-03
随着Android Studio的不断发展，版本众多，选择一个适合自己需求的版本变得尤为重要。本文将为您推荐适合不同需求的Android Studio版本。 初学者推荐版本：对于刚开始接触Android开发的初学者，建议选择稳定性好、功能齐全的版本。考虑到Android Studio 4.2.1具有更好的稳定性和性能，同时提供了更多的功能和改进，支持新的Android SDK技术，因此这个版本是初学者的理想选择。 开发企业应用推荐版本：在实际企业开发中，推荐使用稳定版的Android Studio。例如，Android Studio Arctic Fox 2020.3.1是稳定版本，适合企业级开发。 追求新功能推荐版本：对于追求新功能的用户，可以选择最新的预览版或Canary版。这些版本通常包含了一些新的功能和改进，可以让您提前体验到未来的Android Studio功能。 跨平台开发推荐版本：如果您需要进行跨平台开发，可以考虑选择支持多平台的Android Studio版本。这些版本通常会提供更多的插件和工具，帮助您更轻松地实现跨平台开发。
ankidroid-2.16alpha47-universal.apk
08-03
ankidroid-2.16alpha47-universal.apk
汽车之家研究院：2023年新能源车主充电体验洞察报告.pdf
最新发布
08-03
汽车之家研究院：2023年新能源车主充电体验洞察报告.pdf
jQuery Ajax应用：基于请求加载HTML数据
"基于请求加载数据的jQuery Ajax应用，用于操作表格和使用插件的教程。主要内容包括jQuery的Ajax功能，如使用load()方法加载HTML和XML数据，以及jQuery对表格的操作和插件的运用。" jQuery 的Ajax应用是前端开发中...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值