在Bootstrap模态中定位元素 [英] Target an element in Bootstrap modal

查看:90
本文介绍了在Bootstrap模态中定位元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述


我编写了这段代码,以便当用户位于密码文本框时,他/她可以按Enter键登录.但是,我认为,因为它处于引导程序模式中,所以无法使用jQuery选择器作为目标.任何的想法?

这是HTML:


I wrote this code so when the user is at the password textbox, he/she can press enter to log in. However, I think because it is in the bootstrap modal so I couldn't target it with jQuery selector. Any idea?

Here is the HTML:

                    <!-- Modal content -->
                    <div class="modal-content">

                      <!-- header -->
                      <div class="modal-header"> 
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                        <h4 class="modal-title">Login</h4>
                      </div>

                      <!-- body -->
                      <div class="modal-body text-center" >
                          <input class='form-control' type="text" id="userName" placeholder="Username" ng-model='username'>
                          <input class='form-control' type="password" id="password" placeholder="Password" ng-model='password'>

                      <div class="modal-footer">
                        <button type="button" class="btn btn-default" id ="loginButton" ng-click="goToAdminPanel()">Login</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal" id="closeButton">Close</button>
                      </div>

                    </div>

                 </div>
                </div>
           </div>


还有jQuery


And the jQuery

 $("input#password").keyup(function(event){
if(event.keyCode == 13){
    $("#loginButton").click();
    console.log('This is enter');
}});

推荐答案

,该方法应该可以工作..除非您在脚本运行后生成表单.

that should work.. unless you are generating the form after the script has ran.

尝试:-

$(document).on('keyup', 'input#password', function(event){
   if(event.keyCode == 13){
       $("#loginButton").click();
       console.log('This is enter');
   }
});

或将事件关联到document.ready

or wire the event inside document.ready

$(function(){
   $("input#password").keyup(function(event){
      if(event.keyCode == 13){
        $("#loginButton").click();
        console.log('This is enter');
      }
   });
});

这篇关于在Bootstrap模态中定位元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆