提交按钮上的Mousedown事件与默认点击行为混淆

时间:2013-11-12 12:26:03

标签: jquery asp.net-mvc-4

我有一个部分视图,其中包含文件输入和提交按钮。 当我尝试在单击我的提交按钮时禁用我的文件输入时,HttpPostedFiles在控制器中变为空,我是Jquery的新手,所以我猜这可能会干扰提交按钮的默认行为。 当我对点击事件进行解除绑定时,整个事情都会撤消,文件输入会再次启用。 因此,我尝试在我的提交按钮的mousedown上禁用我的文件输入,同样的问题再次出现。 当我删除此代码时,我会收到发布的文件。

我的观点包含:

@{ Html.BeginForm("ActionName", "ControllerName", FormMethod.Post, 
new { id  "fileUploader",enctype  "multipart/form-data" });}

<div>
<table>
<tr><td><label for="file1">Filename:</label>           
<input type="file" name="files" id="file1" /></td></tr>
<tr><td><label for="file2">Filename:</label>         
<input type="file" name="files" id="file2" /></td></tr>     
<tr><td>  <input type="submit" id="btnUpload" name="Command" Value="Upload"/> </td></tr> </table>
</div>
@{ Html.EndForm();}

我的脚本文件包含:

$(document).ready(function () {
 $('#btnUpload').click(function (e) {
        $('#file1').attr('disabled', true);
        $('#file2').attr('disabled', true);


    });
});

任何想法如何禁用我的文件输入(输入类型=&#34;文件&#34;)而不会导致提交按钮行为混乱?

提前致谢。

1 个答案:

答案 0 :(得分:0)

我通过单击提交按钮禁用文件输入的click事件来解决问题,而不是禁用整个控件,我也使其半透明,以便用户感觉它被禁用。

$('#file1').on("click", false);
    $('#file2').on("click", false);

    $('#file1').css("opacity", "0.5");
    $('#file2').css("opacity", "0.5");

禁用整个控件会使发布的文件为空。