java jquery ajax视频,【Ajax】之jQuery中的Ajax
Ajax
1.jQuery中的Ajax
load()方法
异步请求的地址
异步请求的数据
异步请求成功后的回调函数
返回值服务器端的响应结果jquery
按钮
$('button').click(function(){
$('button').load('data/server2.json', {name:'犬夜叉'}, function(){
console.log('异步请求成功...');
});
});
$.get()与$.post()方法
$.get(url, data, callback, type)方法-请求方式GET
$.post()方法-请求方式POST
异步请求的地址
异步请求的数据
异步请求成功后的回调函数
设置服务器端响应结果的格式ajax
按钮
$('button').click(function(){
$.get('data/server2.json', {name:'犬夜叉'}, function(response){
console.log(response);
}, 'json');
});
ajax()方法
url；异步请求的地址
settings-对象类型
data - 发送给服务器端的请求数据
dataType-服务器端响应结果的格式
success-异步请求成功后回调函数json
按钮
$('button').click(function(){
$.ajax('data/server2.json', {
type : 'get',
dataType : 'text',
success : function(data){
console.log(data);
}
});
});
$.getScript方法
url；JavaScript文件url地址
callback；该文件成功加载后回调函数
`
按钮
服务器
$('button').click(function () {
// 动态加载指定JavaScript文件，而且执行
$.getScript('data/server.js',function (data) {
console.log(data);
eval(data);
});
});
`异步
$.getJSON()方法
url；JavaScript文件url地址
data；发送个服务端key/value的数据内容
callback；该文件成功加载后回调函数函数
按钮
$('button').click(function(){
// getJSON()方法的请求方式为GET
$.getJSON('data/server2.json', {name:'张无忌'},function(data){
console.log(data);
});
});
2.异步提交表单
获取全部表单组件的数据值
并该数据值拼成指定的字符串和JSON格式的数据
并经过异步交互的方式提交表单post
表单序列化
serialize()方法把表单组件数据值转换为字符串内容
serializeArray()方法把表单组件数据值转换为JSON的数据格式url
$('form').bind('submit',function (event) {
event.preventDefault();
// 阻止默认行为
/*var data = $('form').serialize();*/
var data = $('form').serializeArray();
// 根据表单默认同步提交获取数据方式
console.log(data);
$.post('data/server5.json',daa, function (response) {
// 经过异步交互提交表单
console.log(response);
});
});
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！