欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

jQuery ajax 提交表单图片

程序员文章站 2023-08-23 10:23:40
基于 jQuery HTML: JS: ......

基于 jquery

 

html:

<form id="form" enctype="multipart/form-data">
    <input type="text" name="name" />
    <input type="text" name="desc" />
    <input type="file" name="image"  id="doc0" />

    <button type="button" id="submit" > 提交 </button>
</form>

 

js:

// 提交表单
    $('#submit').click(function () {
        
        // 创建formdata对象
        var data = new formdata($('#form')[0]);

        // 为formdata对象添加数据
        $.each($('#doc0')[0].files, function(i, file) {
            data.append('image', file);
        });

        $.ajax({
            url:'yoururl',
            type:'post',
            data:data,
            cache: false,
            contenttype: false,        /* 不可缺 */
            processdata: false,         /* 不可缺 */
            success:function(result){
                // 这里是你的成功逻辑
            }
        });
    });