如果可能的话,我正在尝试使用Parsley.js验证上传的文件大小。我也对其他方法持开放态度。 (我尝试过使用其他方法但没有成功)。如果我可以选择的话,这种方法将是我最想要的方法 - 如果这有意义的话。 (主要是因为我使用欧芹进行所有其他验证)。
我收到的错误是:Uncaught TypeError:无法调用null的方法'parsley'。我也试过修改其他代码但没有成功。
Here是欧芹文档。
是的,这是针对课堂上的PHP项目(这部分不是必需的)。但是,当上传的文件太大时 - 我使用php提交检查文件大小 - 它会破坏我的sql上传。所以我想在上传之前验证客户端。我没有成功。如果文件大小太大,我需要表单不提交。此外,我确实意识到我尝试的方法可能无法在所有浏览器中使用。
我有这些脚本:
<script language="javascript" src="js/jquery-1.10.2.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script language="javascript" src="js/parsley.js"></script>
这是我的自定义欧芹代码(找到here):
<script language="javascript">
$('myFile').parsley({
validators: {
filemaxsize: function (val, max_megabytes, parsleyField) {
if (!Modernizr.fileapi) { return true; }
var $file_input = $(parsleyField.element);
if ($file_input.is(':not(input[type="file"])')) {
console.log("Validation on max file size only works on file input types");
return true;
}
var max_bytes = max_megabytes * BYTES_PER_MEGABYTE, files = $file_input.get(0).files;
if (files.length == 0) {
// No file, so valid. (Required check should ensure file is selected)
return true;
}
return files.length == 1 && files[0].size <= max_bytes;
}
},
messages: {
filemaxsize: "The file cannot be more than 1.5 megabytes."
}
});
</script>
这是我的表单代码(我删除了许多其他表单字段):
<form action="register.php" enctype="multipart/form-data" method="post" autocomplete="on" class="form-horizontal" parsley-validate id="register">
<div class="fields">
<div class="field upl">
<label for="file">Face picture:</label>
<input data-filemaxsize="1.5" type="file" name="file" id="myFile" accept="image/jpeg" required/>
</div>
<input type="submit" value="Register" class="login" id="register" onsubmit="return validation(this)" />
</div>
</form>
此外::(!Modernizr.fileapi) - &gt;这段代码做什么/指的是什么?
答案 0 :(得分:1)
我有一种感觉,你所写的验证器不符合所需的相同结构。我之前使用过Parsley.js,但我从未编写过新的验证器。如果您查看https://github.com/guillaumepotier/Parsley.js/blob/master/parsley.extend.js,您会看到每个验证器都返回validate
函数。
尝试将其添加到验证器中。
答案 1 :(得分:1)
问题是我正在使用的原生质日期选择器。我通过切换到jQuery验证插件修复了我遇到的问题。验证器现在工作得很好!然而,我用php运行所有相同的验证服务器端。我真的很感激输入,最后切换库解决了一切!