最新消息: USBMI致力于为网友们分享Windows、安卓、IOS等主流手机系统相关的资讯以及评测、同时提供相关教程、应用、软件下载等服务。

form表单的回调

IT圈 admin 2浏览 0评论

form表单的回调

背景:平时使用的form表单只能单方向提交,不能进行和ajax类似的回调,在这种背景下给大家介绍一下这种新的方法实现form表单的回调

用到的js脚本

 

应用:提交文件到服务器(form表单最简单),同时进行回调。

注,文件提交的代码没写,本案例目标是掌握form表单回调

本文档使用方法:

  1. 把文件放在phpstudy的WWW目录

 

  1. 浏览器访问

 

  1. 成功显示

 

jquery.form.js传送门:.form.js      点击网页另存为

jquery传送门:.3.1.min.js

1.html代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title>
<script src="./js/jquery-3.3.1.min.js"></script>
<script src="./js/jquery.form.js"></script>
</head>
<body><form action="./server.php" id="form1" method="post"  enctype="multipart/form-data"><input type="file" id="file_sc" name="file" ><br/>提交人:<input type="text" id="name" name="name" ><br/><input type="submit" id="tj" value="提交"></form>
<script>$("#form1").bind("submit", function(){  var file=$("#file_sc").val();if(file == ""){  alert("请选择文件!!!");return false;  }  
});
$(function(){/** 验证文件是否导入成功  */$("#form1").ajaxForm(function(data){  if(data=="1"){alert("提交成功!");   }});     
});
</script>
</body>
</html>

server.php代码:

<?phpecho 1;?>

 

 

 

form表单的回调

背景:平时使用的form表单只能单方向提交,不能进行和ajax类似的回调,在这种背景下给大家介绍一下这种新的方法实现form表单的回调

用到的js脚本

 

应用:提交文件到服务器(form表单最简单),同时进行回调。

注,文件提交的代码没写,本案例目标是掌握form表单回调

本文档使用方法:

  1. 把文件放在phpstudy的WWW目录

 

  1. 浏览器访问

 

  1. 成功显示

 

jquery.form.js传送门:.form.js      点击网页另存为

jquery传送门:.3.1.min.js

1.html代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title>
<script src="./js/jquery-3.3.1.min.js"></script>
<script src="./js/jquery.form.js"></script>
</head>
<body><form action="./server.php" id="form1" method="post"  enctype="multipart/form-data"><input type="file" id="file_sc" name="file" ><br/>提交人:<input type="text" id="name" name="name" ><br/><input type="submit" id="tj" value="提交"></form>
<script>$("#form1").bind("submit", function(){  var file=$("#file_sc").val();if(file == ""){  alert("请选择文件!!!");return false;  }  
});
$(function(){/** 验证文件是否导入成功  */$("#form1").ajaxForm(function(data){  if(data=="1"){alert("提交成功!");   }});     
});
</script>
</body>
</html>

server.php代码:

<?phpecho 1;?>

 

 

 

与本文相关的文章

发布评论

评论列表 (0)

  1. 暂无评论