提交preventDefault()的jQuery不起作用

时间:2012-05-11 12:29:14

标签: jquery asp.net-mvc-3 forms onsubmit

我有提交按钮和输入='文件'控件的html表单:

<form action="/Profile/UploadFile" enctype="multipart/form-data" method="post" onsubmit="OnUploadSubmit(this)"> 

OnUploadSubmit函数如下所示:

  if (e.files[0].size > 5000000) {
        $('#upload_error').css('display', 'block');
        $('#upload_error').text('The file size is too large for upload')
        e.preventDefault();
        return false;
    }

    var files = e.files;
    var ext = $('#file_uploader').val().split('.').pop().toLowerCase();
    if ($.inArray(ext, ['jpeg', 'jpg', 'png']) == -1) {
        $('#upload_error').css('display', 'block');
        $('#upload_error').text('Only, jpg, jpeg, png is allowed');
        e.preventDefault();
        return false;
    }
    return true;
}

e.preventDefault()并返回false;无论如何都不提交工作表格。

有人知道我的问题是什么吗?

由于

4 个答案:

答案 0 :(得分:8)

首先你不能以这种方式使用preventDefault,因为你没有将事件对象传递给函数,接下来:

onsubmit="return OnUploadSubmit(this)"

我推荐:

添加id属性并删除onsubmit:

<form id="upload" action="/Profile/UploadFile" enctype="multipart/form-data" method="post"> 

jQuery的:

$(function(){ // Document Ready

        $('#upload').submit(function(e){

        e.preventDefault();
         if (e.files[0].size > 5000000) {
                $('#upload_error').css('display', 'block');
                $('#upload_error').text('The file size is too large for upload')
            }

            var files = e.files;
            var ext = $('#file_uploader').val().split('.').pop().toLowerCase();
            if ($.inArray(ext, ['jpeg', 'jpg', 'png']) == -1) {
                $('#upload_error').css('display', 'block');
                $('#upload_error').text('Only, jpg, jpeg, png is allowed');
            }
        }

    });

});

答案 1 :(得分:3)

OnUploadSubmit的方法定义是否包含e作为参数?如果没有,e.preventDefault将无效。

答案 2 :(得分:2)

您是否尝试过onsubmit="return OnUploadSubmit(this);"而不是onsubmit="OnUploadSubmit(this)"

答案 3 :(得分:2)

我认为你需要onsubmit="return OnUploadSubmit(this)"