jquery form 插件的使用-优快云博客

本文链接：https://blog.youkuaiyun.com/iteye_20450/article/details/81796926

本文介绍如何利用jQuery简化表单提交过程，并实现文件上传功能。通过示例代码展示了页面中引入jQuery及其插件的方法，定义了包含多个文件输入字段的表单结构，并通过JavaScript函数实现了表单数据的异步提交。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在頁面中先引入jquery的js：

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

表單代碼：

<form action="projectNeedsAddProjectNeedsAction.action" name="projectNeedsAddForm" id="projectNeedsAddForm" method="post" enctype="multipart/form-data" > 
标题：input type="text" name="project_needs_title" id="project_needs_title"  />
內容：<textarea id="project_needs_content" name="project_needs_content" rows="13" cols="89" value="" ></textarea>
複件1：<input type="file" name="upload"  />
複件2：<input type="file" name="upload"  />
複件3：<input type="file" name="upload"  />
<input id="diandian" type="button" class="btn" value="确 定" onclick="javascript:tt()" /> 
<input type="reset" class="btn" value="取 消" />

js代碼：

function tt (){
    alert("start");
    var options ={
        //target:'#project_needs',
        url:'projectNeedsAddProjectNeedsAction.action',  //提交地址
        type:'POST',          //方式
        dataType: 'html',   //服务器返回的数据形式
        success: function('html') {    //回传函数实体，参数为XMLhttpRequest.responseText   
            alert('success!!form');
            $("#project_needs").html('html') ; 
        }
    };
    $('#projectNeedsAddForm').ajaxSubmit(options); //options
    return false; 
    alert("end");
}