jquery表单没有按预期工作. ajaxForm不是一个函数

前端之家收集整理的这篇文章主要介绍了jquery表单没有按预期工作. ajaxForm不是一个函数前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图使用 jquery形式,但它在concole ajaxForm不是一个函数.
正确包含了jquery.form.js,代码在文档就绪函数中…

这是脚本:

$("#apply-form").ajaxForm({

                beforeSend: function()
                {
                    $("#progress").show();
                    //clear everything
                    $("#bar").width('0%');
                    $("#message").html("");
                    $("#percent").html("0%");
                },uploadProgress: function(event,position,total,percentComplete)
                {
                    $("#bar").width(percentComplete+'%');
                    $("#percent").html(percentComplete+'%');

                },success: function()
                {
                    $("#bar").width('100%');
                    $("#percent").html('100%');

                },complete: function(response)
                {
                    $("#message").html("<font color='green'>"+response.responseText+"</font>");
                },error: function()
                {
                    $("#message").html("<font color='red'> ERROR: unable to upload files</font>");

                }
            });

这是HTML表单

<form id="apply-form" enctype="multipart/form-data" method="post" action="">


    <table>
                <tr><td>CV:</td>
                    <td>
                        <input type="file" name="cover">
                    </td>
                </tr>
                <tr><td>Cover Letter:</td>
                    <td>
                        <input type="file" name="curriculum">
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <div id="progress">
                            <div id="bar"></div>
                            <div id="percent">0%</div >
                        </div>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <div id="message"></div>
                    </td>
                </tr>
            </table>
        </form>

我在codeigniter中创建网站,我有一个页面模板,包含在每个页面.在头部分我按此顺序包括我的所有脚本:

<script src="/jobs/public/js/jquery.js"></script>
        <script src="/jobs/public/js/jquery.form.js"></script>
        <script src="/jobs/public/js/javascript.js"></script>
        <link href="/jobs/public/js/jquery-ui-1.10.3.custom/css/custom-theme/jquery-ui-1.10.3.custom.css" rel="stylesheet">
        <script src="/jobs/public/js/jquery-ui-1.10.3.custom/js/jquery-1.9.1.js"></script>
        <script src="/jobs/public/js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.js"></script>

我也在使用jQuery UI.这可能是问题吗?

解决方法

你正在加载jQuery两次.第二次加载jQuery会覆盖第一个和clobbers任何插件.
<script src="/jobs/public/js/jquery.js"></script>
<script src="/jobs/public/js/jquery.form.js"></script>
...
<script src="/jobs/public/js/jquery-ui-1.10.3.custom/js/jquery-1.9.1.js"></script>

这是第二个jquery-1.9.1没有得到.ajaxForm.使用其中一个.

将表单jquery添加到脚本的底部

猜你在找的jQuery相关文章