zoukankan      html  css  js  c++  java
  • jQuery.form的使用方法

    首先需要引入jquery.form.js
    之后即可使用


    本示例为上传文件+form表单提交
    使用的方法是提交地址写在form表单当中,在提交前进行检查工作,检查内容是否符合规范(是否为空),若为空则弹出提示信息,并不进行发送处理。
    1. <%--
    2. Created by IntelliJ IDEA.
    3. User: 水之笔记
    4. Date: 2017/3/9
    5. Time: 22:02
    6. To change this template use File | Settings | File Templates.
    7. --%>
    8. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    9. <html>
    10. <head>
    11. <title>上传获奖作品</title>
    12. <script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery.js"></script>
    13. <script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/is_null.js"></script>
    14. <script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery.form.js"></script>
    15. <script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/competition_name.js"></script>
    16. <script type="text/javascript">
    17. $(document).ready(function () {
    18. $("#uploadForm").ajaxForm({
    19. resetForm: true,
    20. clearForm: true,
    21. //定义返回JSON数据,还包括xml和script格式
    22. dataType: 'json',
    23. // 在发送之前进行的操作,如果有问题,返回false即可不会进行提交
    24. beforeSend: function () {
    25. //表单提交前做表单验证
    26. if (isNull($("#name").val()) || isNull($("#year").val()) || $("#competition") == "请选择") {
    27. alert("不能为空");
    28. return false;
    29. }
    30. if ($("#file1").get(0).files[0] == null) {
    31. alert("请至少上传源文件");
    32. return false;
    33. }
    34. return true;
    35. },
    36. success: function (data) {
    37. //提交成功后调用
    38. alert(data.messageContent);
    39. window.location.reload();
    40. }
    41. });
    42. });
    43. </script>
    44. </head>
    45. <body>
    46. <div>
    47. <form method="post" enctype="multipart/form-data" id="uploadForm"
    48. action="${pageContext.request.contextPath}/background/worksInsert">
    49. 作品名称:<input type="text" name="name" id="name"><br>
    50. 参赛年份:<input type="text" name="year" id="year"><br>
    51. 参加竞赛:<select name="competition" id="competition">
    52. <option value="请选择">请选择</option>
    53. </select><br>
    54. 源文件上传:<input type="file" name="file1" id="file1"><br>
    55. 展示文件上传:<input type="file" name="file2" id="file2"><br>
    56. 附件上传:<input type="file" name="file3" id="file3"><br>
    57. <input type="submit" value="提交">
    58. </form>
    59. </div>
    60. </body>
    61. </html>

  • 相关阅读:
    菜鸡学习之路之并查集
    Leetcode 28. 实现 strStr() python3
    Leedcode 67. 二进制求和 python3
    2020 高校战“疫”网络安全分享赛 misc ez_mem&dump & 隐藏的信息
    leetcode 709.转换成小写字母
    2020 MetasequoiaCTF 部分misc
    Linux任务在后台运行
    Linux网络监控(netstat)
    Linux中wget资源下载
    Linux远程登录+远程发送文件
  • 原文地址:https://www.cnblogs.com/crowsong/p/6623716.html
Copyright © 2011-2022 走看看