【问题标题】:jQuery Bootstrap: "TypeError: 'undefined' is not a function (evaluating 'jQuery('#myModal').modal('hide')')jQuery Bootstrap:“TypeError:'undefined' 不是函数(评估 'jQuery('#myModal').modal('hide')')
【发布时间】:2013-09-09 13:03:45
【问题描述】:

在我的应用程序中,我想在 ajax 请求完成后手动关闭引导模式视图。 我在回调中调用jQuery('#myModal').modal('hide');

function(){                                       
   jQuery('#myModal').modal('hide');
}

但模态视图不会被隐藏。我仔细检查了我在 Bootstrap 之前包含了 jQuery,所以问题不存在。

我总是收到以下错误:

TypeError: 'undefined' is not a function (evaluating 'jQuery('#myModal').modal('hide')')

模态看起来像这样:

   <!-- Modal -->
<div aria-hidden="false" aria-labelledby="modalInviteFlatmateLabel" role="dialog" tabindex="-1" class="modal hide fade in" id="myModal">
    <form id="add-flatmate-form" action="/flatmates/show" method="post">    
    <div class="modal-header">
        <button aria-hidden="true" data-dismiss="modal" class="close" type="button">&times;</button>
        <h3 id="modalInviteFlatmateLabel">Invite Flatmate</h3>
    </div>
    <div class="modal-body">
        <p>
            Enter the mail address of your flatmate you want to invite.
        </p><br />
        <input placeholder="E-Mail" class="input-block-level" name="AddFlatmateForm[email]" id="AddFlatmateForm_email" type="text" />    </div>
    <div class="modal-footer">
        <input class="btn btn-primary" type="submit" name="yt0" value="Invite" id="yt0" />        <!--<button class="btn btn-primary">Invite</button>-->
    </div>
    </form>
</div><!--#myModal-->

附加信息:

  • jQuery 版本:1.9.1,
  • 引导版本:2.3.2

有什么想法吗?

【问题讨论】:

  • 使用的模态版本?
  • 你能检查jQuery('#myModal').data('bs.modal')返回的内容吗
  • 它返回“未定义”
  • 这意味着模态似乎被破坏了......你能分享代码
  • 不会是jQuery('#modalInviteFlatmate').modal('hide'); 吗?

标签: jquery html twitter-bootstrap


【解决方案1】:

已经很晚了,但我希望这会有所帮助。 确保在自定义脚本之前包含 jQuery 库,并且 Firebug 的 Net 选项卡中没有错误(确保实际加载了 jQuery)。 在 firebug 中测试您的 javascript 代码,当准备好添加到您的实际代码中时,您可以将其称为匿名函数:

(function ($) {
   $(document).ready(function(){
     //your code
     ('# id of the modal element to close ').modal('hide')
   });
//your code
}(jQuery));

您可以查看此视频link to tutorial,我认为他们对调试过程有很好的了解。

【讨论】:

    猜你喜欢
    • 2014-12-20
    • 2016-05-18
    • 2012-10-06
    • 2016-01-05
    • 1970-01-01
    • 2015-05-09
    • 1970-01-01
    • 2015-11-26
    • 1970-01-01
    相关资源
    最近更新 更多