简体   繁体   中英

modal function not showing the modal

Hi im writing a function that i can reuse to show/hide modals and on my website but it does not seem to work. when i used the same code outside a funtion and using direct id and class names instead of variables it worked fine its only when im passing them in that it does not appear to work?

<input id="lrBtn" type="button" value="Login/Register" onclick="ShowModal('PopUpLR','closeLR');" />




function ShowModal(var popup,var closeBtn){
        var modal = document.getElementById(popup);
        var span = document.getElementsByClassName(closeBtn)[0];
        modal.style.display = "block";
        span.onclick = function() {
            modal.style.display = "none";
        }
        window.onclick = function(event) {
            if (event.target == modal) {
                modal.style.display = "none";
            }
        }
    }

The way you define your ShowModal function is wrong You need to write it like this

function ShowModal(popup,closeBtn){
 // your code
}

instead of

function ShowModal(var popup,var closeBtn)
{
// your code
}

Full code:

function ShowModal(popup,closeBtn){
        var modal = document.getElementById(popup);
        var span = document.getElementsByClassName(closeBtn)[0];
        modal.style.display = "block";
        span.onclick = function() {
            modal.style.display = "none";
        }
        window.onclick = function(event) {
            if (event.target == modal) {
                modal.style.display = "none";
            }
        }
    }

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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