0

jsfiddle上的以下代码:http: //jsfiddle.net/mppcb/1/在那里完美运行,但是当我在我的网站(http://www.tuivel.com/upload/index.html)上复制相同的代码时不会工作:

HTML:

<form id="myform" novalidate="novalidate">
    <input type="text" name="field1[]">
    <br>
    <input type="text" name="field2[]">
    <br>
    <input type="text" name="field3[]">
    <br>
    <input type="file" name="field4[]" id="filename">
    <br>
    <input type="submit">
</form>

JS 和 jQuery:

<script type="text/javascript">
$(document).ready(function() {

    function Checksize(){
    var iSize = ($("#filename")[0].files[0].size);
       alert(iSize);
     if (iSize < 2097152.00) 
         { 
        alert("Es menor a 2 megabytes!!!!");
         return true;
         }
       else{
           alert("Es mayor a 2mb!!");
           return false;
           }
    }


function Checkfiles() {
        var fup = document.getElementById('filename');
        var fileName = fup.value;
        var ext = fileName.substring(fileName.lastIndexOf('.') + 1);
        var chkext = ext.toLowerCase();
        //var fileSize = fup.size;

    if(chkext=="gif" || chkext=="jpg" || chkext=="jpeg" || chkext=="png") {
        alert("Successfully Uploaded!");
        return true;
    }
    else {
        alert("Upload GIF, PNG, JPG Images only");
        return false;
    }
} 

    $('#myform').validate({
        rules: {
            "field1[]": {
                required: true,
                minlength: 5
            },
            "field2[]": {
                required: true,
                url: true
            },
            "field3[]": {
                required: true,
                email: true
            },
            "field4[]": {
                required: true,
                minlength: 5
            }
        },
        submitHandler: function(form) { // for demo
            var result=Checkfiles();
            var size=Checksize();
            alert(size);
            alert(result);
            if(size==true && result==true) {
                alert("Ya se subió!!!");
                return true;
            } else {
                alert("Por algo no pasó!!!");
                return false;
            }

        }
    });

});
</script>

我还包括 jQuery 库:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

任何奇怪为什么不为我工作?提前致谢。

4

1 回答 1

3
$('#myform').validate({

您没有validate在您的网站上使用该插件,但 jsFiddle 的作者使用了:

jsfiddle 验证插件

要解决此问题,只需下载validate插件,然后将其添加到脚本之前的 HTML 中:

<script type="text/javascript" src="path/to/validate/plugin.js"></script>

为了将来参考,您可以通过单击 jsFiddle 左侧边栏的“外部资源”来查看所有包含的插件。

于 2013-04-23T00:25:29.333 回答