jquery.form.js实现图片上传后预览

         jQuery Form插件是一个优秀的Ajax表单插件，可以非常容易地、无侵入地升级HTML表单以支持Ajax。jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubmit()， 它们集合了从控制表单元素到决定如何管理提交进程的功能。另外，插件还包括其他的一些方法： formToArray()、formSerialize()、fieldSerialize()、fieldValue()、clearForm()、clearFields() 和 resetForm()等。

     下面是一个简单的案例：

         1.导入js   

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

       2.建立一个from表单

    //图片显示
    <div style=" width:120px; height:120px;">
        <img id="ImgPr" width="120" height="120" src="" />
    </div>
    //from表单
     <form id="picForm" name="picForm" action="fileAction!uploadFile.action" method="post" enctype="multipart/form-data">
        <input type="file" id="file" name="file" οnchange="updataFile();" size="30"/>
         <input type="submit" value="上传"/>
    </form>

      3.javaScript 脚本    

<script language="javascript">
    
    $(function(){
        // 为表单绑定异步上传的事件
        $("#picForm").ajaxForm({
            url : "fileAction!uploadFile.action", // 请求的url
            type : "post", // 请求方式
            dataType : "json", // 响应的数据类型
            async :true, // 异步
            success : function(data){
                $("#ImgPr").attr("src", data.fileID);
            },
            error : function(){
                alert("数据加载失败！");
            }
        });
    });
    //选择图片后无需点击上传,直接上传图片
    function updataFile(){
        // 提交表单
        $("#picForm").ajaxSubmit({
            url : "fileAction!uploadFile.action", // 请求的url
            type : "post", // 请求方式
            dataType : "json", // 响应的数据类型
            async :true, // 异步
            success: function (data) {
                $("#ImgPr").attr("src", data.fileID);
            },
            error : function(){
                alert("数据加载失败！");
            }
        });
    }

</script>

        4.struts配置:

        <action name="fileAction" class="com.transn.wmt365.usercenter.action.FileUploadAction" />

        5.java后台处理部分就不写了。每个人的实现都不相同

     关于JS的貌似没有上传的地方。这个是下载地址http://download.csdn.net/detail/king841021/8009647