简体   繁体   English

使用jQuery弹出模态

[英]PopUp a Modal using jQuery

I want to popup my login modal on Search click if loginStatus == false, using jQuery. 如果要使用jQuery,如果loginStatus == false,我想在搜索点击时弹出我的登录模式。

Ie if user is not logged in, I want him to login first. 即,如果用户未登录,我希望他先登录。

        $('#serviceSelect').on('click', function(event) {
        if (found == 0) {
            alert("Sorry donot exist")
        }
        if(found ==1)
            {
            var status=sessionStorage.getItem('isLoggedIn');
            //alert(status);
            if(status==true){
                alert("Logged in");

            /*--------------    Specify the Questionnare link here -------------*/
            }
            else{
                alert("Logged out");
                /*$('#serviceSelect').attr('data-target','#login-modal');*/

                var modal = $("#login-modal");
                modal.style.display = "block";
            }
            }
         });

This is the list item which popus the login if user wants to login by himself . 如果用户要自己登录,这是弹出登录的列表项。

       <li class="sidebar-brand" id="loginref"><a href="#"
                data-toggle="modal" data-target="#login-modal"
                data-backdrop="static">

Login Modal div: 登录模式div:

    <div class="modal fade" id="login-modal" tabindex="-1" role="dialog"
    aria-labelledby="myModalLabel" aria-hidden="true"
    style="display: none;">

Update: 更新:

This is popping the modal, but the js of the modal is not attached with the modal. 这会弹出模式,但模式的js不会随模式附加。

ie, There is a login.js which executes on login modal. 即,有一个login.js在登录模式下执行。 By popping modal using this, that js is not being executed. 通过使用此弹出模式,就不会执行该js。

         modal.modal('show');

试试这个代码

$('#login-modal').modal('show');

Use bootstrap .modal('show'); 使用bootstrap .modal('show');

$('#serviceSelect').on('click', function(event) {
        if (found == 0) {
            alert("Sorry donot exist")
        }
        if(found ==1)
            {
            var status=sessionStorage.getItem('isLoggedIn');
            //alert(status);
            if(status==true){
                alert("Logged in");

            /*--------------    Specify the Questionnare link here -------------*/
            }
            else{
                alert("Logged out");
                /*$('#serviceSelect').attr('data-target','#login-modal');*/

                var modal = $("#login-modal");
                modal.modal('show');
            }
            }
         });

mote info on bootstrap 引导程序上的远程信息

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM