Bootstrap 3 JQuery验证不起作用

I am working on Symfony2 project and have used bootstrap 3.0.2. I have used jquery validation 1.9.0 plugin for login validation. I want to do somethi like thisFiddle is worked in core php but in symfony it doesn't work. Here is my code

Login.html.twig

<script src="{{asset('bundles/Loginbundle/js/script.js')}}"></script>
<script src="{{asset('bundles/Loginbundle/js/jquery-1.7.1.min.js')}}"></script>
<script src="{{asset('bundles/Loginbundle/js/jquery.validate.min.js')}}"></script>
<link href="{{asset('bundles/Loginbundle/css/bootstrap.css')}}" rel="stylesheet">
<form id="contact-form" class="form-horizontal" action="{{ path('login_login_homepage')}}" method="POST">
    <div class="form-group">
        <label class="control-label" for="user">Username:</label>
        <div class="input-group">
            <span class="input-group-addon">@</span>
            <input type="text" class="form-control" name='user' placeholder='Username' />
        </div>
    </div>    
    <div class="form-group">
        <label class="control-label" for="pass">Password:</label>
        <div class="input-group">
            <span class="input-group-addon"></span>
            <input class="form-control" type='password' name='pass' placeholder='Password'/>
        </div>
    </div>    
    <div class="checkbox">
        <label>
            <input type="checkbox" name="remember">
            Remember Me
        </label>
    </div>
    <!--<input type="checkbox" name="remember" value="Remember-Me"><p style="display:inline;"> &nbsp;Remember Me</p>
    -->
    <button class="btn btn-primary" type="submit" >SignIn</button>
    <a href="{{path('login_login_signup')}}">Sign Up</a>
    <br><br><br>  
</form>

scripy.js

$('form').validate({
    rules: {
        user: {
            minlength: 5,
            maxlength: 15,
            required: true
        },
        email: {
            required: true
        },
        pass: {
            minlength: 5,
            maxlength: 15,
            required: true
        }
    },
    highlight: function(element) {
        $(element).closest('.form-group').addClass('has-error');
        $(element).closest('.form-group').removeClass('has-success');
    },
    unhighlight: function(element) {
        $(element).closest('.form-group').removeClass('has-error');
        $(element).closest('.form-group').addClass('has-success');
    },
    errorElement: 'span',
    errorClass: 'help-block',
    errorPlacement: function(error, element) {
        if (element.parent('.input-group').length) {
            error.insertAfter(element.parent());
        } else {
            error.insertAfter(element);
        }
    }
});

I have tried to debig using firebug and it shows error as below

But, still not working.Please help me out.

Maybe script runs before page load. Try this in script.js

$(document).ready(function() {
    $('form').validate({
        rules: {
            user: {
                minlength: 5,
                maxlength: 15,
                required: true
            },
            email: {
                required: true
            },
            pass: {
                minlength: 5,
                maxlength: 15,
                required: true
            }
        },
        highlight: function(element) {
            $(element).closest('.form-group').addClass('has-error');
            $(element).closest('.form-group').removeClass('has-success');
        },
        unhighlight: function(element) {
            $(element).closest('.form-group').removeClass('has-error');
            $(element).closest('.form-group').addClass('has-success');
        },
        errorElement: 'span',
        errorClass: 'help-block',
        errorPlacement: function(error, element) {
            if (element.parent('.input-group').length) {
                error.insertAfter(element.parent());
            } else {
                error.insertAfter(element);
            }
        }
    });
});