0

0

ajax的配置详情、ajax的调用解释、ajax的中文乱码和ajax的表单提交(内有实例)

寻∝梦

寻∝梦

发布时间:2018-09-10 11:28:45

|

1512人浏览过

|

来源于php中文网

原创

本篇文章主要的讲述了关于ajax的使用总结说明,还有ajax的配置、调用、中文乱码、表单提交等等详细解释,现在我们一起来看这篇文章吧

  ·jquery的使用
   0、必须优先引入jquery.js 否则无法调用jquery框架
   1、js区分大小写,起名字的时候要注意
   2、jquery根据p的id属性获取页面text的值:$("#demoid").val(),根据class属性获取页面text的值$(".democlass").val(),如果是赋值$("#demoid").val("赋值的参数")
   3、$(document).ready(function(){代码})、$().ready(function(){代码})、$(function(){代码})的含义一样
   4、多个$(function(){代码})可以并存,即只要名字不重复可以同时发挥作用
   5、$(function(){代码})的意思是页面加载完毕即运行,比如自动点击,自动弹框,再或者点击监听或者其他监听
   6、加载完即点击和“点击的监听”的区别(非常有借鉴意义)
      比如现在有一个js方法,function demofunction(){alert("这个方法运行了");};
      加载完即点击:$("#demoid").click(demofunction());
      加载完后即监听,这个方法只能是在按钮有click这个动作,或者通过jquery有click()动作:$("#demoid").click(function(){demofunction()});
   7、如果是自动加载即运行的,或者需要被监听的都需要放置到$(document).ready(function(){代码})的代码中
   8、window.onload=function(){代码}与$(function(){代码})的区别
      ·调用函数的用法不同:
      window.onload = function(){代码};
      $(function(){代码})
      ·调用函数的时间不同
      window.load=function(){代码}:必须等待网页中所有的内容加载完毕(包括图片)才能执行,比如要运用上传等功能。
      $(function(){代码}),等到网页中所有的dom结构绘制完毕后就可以执行。
   9、ajax专题
      ·需要的jar包:commons-lang-2.5.jar、commons-lang3-3.1.jar、javassist-3.11.0.ga.jar
      ·前台js的写法:为了简化流程,写成页面加载即运行
      $(document).ready(function(){
$.ajax({

url : "testajax.do",// 请求地址
//timeout : 600000,//超时时间设置,单位毫秒
async : false,// 异步
cache : false,// 缓存
type : 'post',// 请求方式
data: {"name":"123"},//data: $('#formid').serialize(),//序列化表单-当触发一个form表单提交的ajax事件的时候,这个序列化方法自动将数据转化为json格式传递给后台
dataType : 'json',// 服务器返回的数据类型
success : function(msg) {// 请求成功后调用的
alert("返回json的实验成功了"+" msg.resultcode="+msg.resultcode+" msg.name="+msg.name);
},
error :function(){
alert("异常");
}
});
      });

      ·struts.xml文件的写法

      
      
    
    



message



        /index.jsp
       
 


    

    ·后台java代码:仅距离调用ajax,故不涉及数据库操作

    import java.io.IOException;
    import java.io.PrintWriter;
    import java.util.HashMap;
    import java.util.Map;
    import javax.servlet.http.HttpServletResponse;
    import org.apache.struts2.ServletActionContext;
    public class AjaxTest {
protected Map message = new HashMap();
/** AJAX请求返回RESULT的name常量*/
protected final static String MESSAGE = "message";
public Map getMessage() {
return message;
}
public void setMessage(Map message) {
this.message = message;
}
//-登录页面中form表单提交的路径
public String testajax() throws IOException{
System.out.println("获取参数name="+ServletActionContext.getRequest().getParameter("name"));
message.put("resultcode", "0000");
message.put("resultcode", "0001");
message.put("name", "zhong文ce试");
return MESSAGE;
}
     }


     ·ajax的应用之提交form表单数据-表单数据自动转json格式
     场景描述:当具体的提交信息为一个form表单,并通过ajax传递给后台时,我们通常使用一个叫序列化的方法将这个form表单转化为json格式传递给后台。(想看更多就到PHP中文网AJAX开发手册栏目中学习)

     ·form表单的格式,form标签有id,input标签有name

360智图
360智图

AI驱动的图片版权查询平台

下载
     
姓名:
年龄:

     ·js部分的代码-可以单独写在一个js文件,注意,需要先引入jquery.js文件

   $(document).ready(function(){
$("#submitid").click(function(){ajaxhere()});
});
     //提交表单的ajax
    function ajaxhere(){
$.ajax({
url : "testajax3.do",// 请求地址
//timeout : 600000,//超时时间设置,单位毫秒
async : false,// 异步
cache : false,// 缓存
type : 'post',// 请求方式
data: $('#formid').serialize(),//序列化表单
dataType : 'json',// 服务器返回的数据类型
//contentType:"application/x-www-form-urlencoded; charset=utf-8",
success : function(msg) {// 请求成功后调用的
alert("form表单触发的实验成功了"+" msg.resultcode"+msg.resultcode+"  msg.name="+msg.name);
},
error :function(){
alert("异常");
}
});
};      
       ·传统的ajax返回方式,即java部分的返回写在流里-特别要注意这里的处理中文乱码的解决方式
HttpServletResponse response = ServletActionContext.getResponse();
response.setCharacterEncoding("utf-8");
PrintWriter writer = response.getWriter();
String a = "{\"resultcode\":\"0000\",\"name\":\"文试\"}";
writer.write(a);
writer.flush();
writer.close();

本篇文章到这就结束了(想看更多就到PHP中文网AJAX使用手册栏目中学习),有问题的可以在下方留言提问。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
java入门学习合集
java入门学习合集

本专题整合了java入门学习指南、初学者项目实战、入门到精通等等内容,阅读专题下面的文章了解更多详细学习方法。

2

2026.01.29

java配置环境变量教程合集
java配置环境变量教程合集

本专题整合了java配置环境变量设置、步骤、安装jdk、避免冲突等等相关内容,阅读专题下面的文章了解更多详细操作。

2

2026.01.29

java成品学习网站推荐大全
java成品学习网站推荐大全

本专题整合了java成品网站、在线成品网站源码、源码入口等等相关内容,阅读专题下面的文章了解更多详细推荐内容。

0

2026.01.29

Java字符串处理使用教程合集
Java字符串处理使用教程合集

本专题整合了Java字符串截取、处理、使用、实战等等教程内容,阅读专题下面的文章了解详细操作教程。

0

2026.01.29

Java空对象相关教程合集
Java空对象相关教程合集

本专题整合了Java空对象相关教程,阅读专题下面的文章了解更多详细内容。

3

2026.01.29

clawdbot ai使用教程 保姆级clawdbot部署安装手册
clawdbot ai使用教程 保姆级clawdbot部署安装手册

Clawdbot是一个“有灵魂”的AI助手,可以帮用户清空收件箱、发送电子邮件、管理日历、办理航班值机等等,并且可以接入用户常用的任何聊天APP,所有的操作均可通过WhatsApp、Telegram等平台完成,用户只需通过对话,就能操控设备自动执行各类任务。

25

2026.01.29

clawdbot龙虾机器人官网入口 clawdbot ai官方网站地址
clawdbot龙虾机器人官网入口 clawdbot ai官方网站地址

clawdbot龙虾机器人官网入口:https://clawd.bot/,clawdbot ai是一个“有灵魂”的AI助手,可以帮用户清空收件箱、发送电子邮件、管理日历、办理航班值机等等,并且可以接入用户常用的任何聊天APP,所有的操作均可通过WhatsApp、Telegram等平台完成,用户只需通过对话,就能操控设备自动执行各类任务。

16

2026.01.29

Golang 网络安全与加密实战
Golang 网络安全与加密实战

本专题系统讲解 Golang 在网络安全与加密技术中的应用,包括对称加密与非对称加密(AES、RSA)、哈希与数字签名、JWT身份认证、SSL/TLS 安全通信、常见网络攻击防范(如SQL注入、XSS、CSRF)及其防护措施。通过实战案例,帮助学习者掌握 如何使用 Go 语言保障网络通信的安全性,保护用户数据与隐私。

8

2026.01.29

俄罗斯Yandex引擎入口
俄罗斯Yandex引擎入口

2026年俄罗斯Yandex搜索引擎最新入口汇总,涵盖免登录、多语言支持、无广告视频播放及本地化服务等核心功能。阅读专题下面的文章了解更多详细内容。

622

2026.01.28

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Go语言实战之 GraphQL
Go语言实战之 GraphQL

共10课时 | 0.8万人学习

微信小程序开发之API篇
微信小程序开发之API篇

共15课时 | 1.2万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号