jquery.form.js------ajaxSubmit提交实例

最新推荐文章于 2021-09-03 21:19:29 发布

Neo_Gamer

最新推荐文章于 2021-09-03 21:19:29 发布

阅读量3k

点赞数 1

分类专栏： javascript 文章标签： jquery.form.js ajaxSubmit

本文链接：https://blog.csdn.net/wendrewshay/article/details/41788995

版权

javascript 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

一、引入jquery.js和jquery.form.js

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

二、以下是jsp页面内容

<body>
	<center>
		<div>
			<form id="photos_form" enctype="multipart/form-data" method="post">
				<input id="ownerId" type="hidden" name="ownerId" value="${ownerId}">
				<input type="file" name="upload" id="upload">
				<button type="button" id="uploadBtn">上传</button>
			</form>
				
			<div id="photosDiv">
				
			</div>
		</div>
	</center>
</body>

三、利用ajaxSubmit方法提交表单

$(function(){
		var options={
		type:"post",  //提交方式  
                dataType:"text", //数据类型  
                url:ctx + "/anon/saveWeddingCardPhoto", //请求url 
                beforeSubmit:showRequest,//提交前的回调函数
                success:showResponse,//提交成功的回调函数
		}
		$("#photos_forms").ajaxForm(options);
		$("#uploadBtn").on('click',function(){
			$("#photos_form").ajaxSubmit(options);
			return false;//防止刷新提交
		});
	});
	
	function showRequest(formData, jqForm, options){
		var queryString = $.param(formData);
		alert('About to submit: \n\n' + queryString);
	}
	
	function showResponse(responseText, statusText){
		alert('status: ' + statusText + '\n\nresponseText: \n' + responseText + 
        '\n\nThe output div should have already been updated with the responseText.');
	}

Neo_Gamer

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery.form.js------ajaxSubmit提交实例

一、引入jquery.js和jquery.form.js二、以下是jsp页面内容上传三、利用ajaxSubmit方法提交表单$(function(){ var options={ type:"post", //提交方式 data
复制链接

扫一扫

专栏目录