javascript / jQuery中的文件大小验证?

时间:2013-11-18 15:17:36

标签: javascript jquery

我想在上传到服务器之前检查文件(图像)大小。我正在使用.aspx页面。此文件上载控件位于jquery对话框中。当用户单击“确定”按钮时,文件大小验证应该有效。

这是我迄今为止所做的守则:

<a id="lnkUploadImg" href="#">Upload Image</a>
                                <br />
                                <div id="myUploadImgDialog" title="Image Upload">
                                    <table>
                                        <tr>
                                            <td align="right">
                                                Image:
                                            </td>
                                            <td>
                                                <input type="file" name="file" value="" id="imgUpload" />
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="right">
                                                Description:
                                            </td>
                                            <td>
                                                <asp:TextBox ID="txtUploadImgDescription" runat="server" TextMode="MultiLine" Width="285"
                                                    Height="80"></asp:TextBox>
                                            </td>
                                        </tr>
                                    </table>
                                </div>

脚本如下:

<script type="text/javascript">
    $(function () {
        $("#myUploadImgDialog").dialog({
            autoOpen: false,
            width: 475,
            modal: true,
            buttons: {
                "OK": function () {
                    if (navigator.appName == "Netscape") {
                        // Validation Code Here
                        // If valid return true else return false
                    }
                    if (navigator.appName == "Microsoft Internet Explorer") {
                        // Validation Code Here
                        // If valid return true else return false
                    }
                },
                Cancel: function () {
                    $(this).dialog("close");
                }
            }
        });
        $("#lnkUploadImg").click(function () {
            $("#myUploadImgDialog").dialog("open");
        });
    });
</script>

请帮帮我。提前谢谢。

1 个答案:

答案 0 :(得分:0)

使用imgUpload的change事件来获取所需的信息。

<button type="button" onclick="javascript: document.getElementById('imageUpload').click();">Upload</button>

var filesInput = document.getElementById("imgUpload");
filesInput.addEventListener("change", function(event){
    var file = event.target.files[0];
    console.log(file.size);
});