Javascript 如何使用JS创建一个可以使用不同触发按钮打开的模式

Javascript 如何使用JS创建一个可以使用不同触发按钮打开的模式,javascript,modal-dialog,Javascript,Modal Dialog,这是我第一次在这里问问题,如果我做错了,我很抱歉。。。 我是丹麦一家网店的实习生,在那里我被任命更新他们的网站。他们目前的网站不使用引导,所以我不能使用引导回答。同样,我对jQuery也不熟悉,因此我更希望答案仅适用于JavaScript。:) 我的问题是,如何制作一个可以从各种不同按钮触发的模式 我已经找到了如何创建一个可以用一个或两个触发器按钮打开的模式-多亏了这里的另一个线程,该模式的脚本代码如下所示: <script> //Get the modal var

这是我第一次在这里问问题,如果我做错了,我很抱歉。。。 我是丹麦一家网店的实习生,在那里我被任命更新他们的网站。他们目前的网站不使用引导,所以我不能使用引导回答。同样,我对jQuery也不熟悉,因此我更希望答案仅适用于JavaScript。:)

我的问题是,如何制作一个可以从各种不同按钮触发的模式

我已经找到了如何创建一个可以用一个或两个触发器按钮打开的模式-多亏了这里的另一个线程,该模式的脚本代码如下所示:

<script>
    //Get the modal
    var prismodal = document.getElementById('prisMatchModal');

    //Get the button that opens the modal
    var prisBtn = document.getElementsByClassName("prisMatchBtn")[0];
    var prisBtn2 = document.getElementsByClassName("prisMatchBtn")[1];

    //Get the <span> element that closes the modal
    var prisClose = document.getElementsByClassName("prisClose")[0];

    //When the user clicks the button, open the modal
    prisBtn.onclick = function() {
        prismodal.style.display = "block";
    }

    prisBtn2.onclick = function() {
        prismodal.style.display = "block";
    }

    //When the user clicks on <span> (x), close the modal
    prisClose.onclick = function() {
        prismodal.style.display = "none";
    }

    //When the user clicks anywhere outside the modal, close it
    window.onclick = function(event) {
        if (event.target == prismodal) {
            prismodal.style.display = "none";
        }
    }
</script>

//获取模态
var prismodal=document.getElementById('prisMatchModal');
//获取打开模式对话框的按钮
var prisBtn=document.getElementsByClassName(“prisMatchBtn”)[0];
var prisBtn2=document.getElementsByClassName(“prisMatchBtn”)[1];
//获取关闭模态的元素
var priscole=document.getElementsByClassName(“priscole”)[0];
//当用户单击该按钮时,打开模式对话框
prisBtn.onclick=函数(){
prismodal.style.display=“块”;
}
prisBtn2.onclick=函数(){
prismodal.style.display=“块”;
}
//当用户单击(x)时,关闭模式对话框
prisClose.onclick=函数(){
prismodal.style.display=“无”;
}
//当用户单击模式之外的任何位置时,请将其关闭
window.onclick=函数(事件){
如果(event.target==prismodal){
prismodal.style.display=“无”;
}
}

我希望它能很好地工作,但是我如何重写它,这样无论有多少个不同的触发按钮,无论你按下哪一个,模态都会打开?

让你的按钮具有相同的
prisBtn
类,并且
prisBtn.onclick
应该总是打开它。你不需要额外的类。@eeetee我一开始确实尝试过,但那只是最后一个作为触发器的按钮。我所有的按钮,打开模态,表示价格,都有prisMatchBtn类。