如何修改它以适用于2种不同的模态弹出窗口?

时间:2014-10-03 03:08:30

标签: javascript

我有一个模态的代码,我知道我不必复制它以允许页面上的另一个按钮调用不同的内容,但我试图以多种方式修改它,没有运气。

请看一看,告诉我我错过了什么。

<script type="text/javascript">
    var modal = document.getElementById("modal");
    var radios = document.querySelectorAll("#modal input[type='radio']");
    var fields = document.getElementById("modal").querySelectorAll("input[type='text']");
    var button_div = document.getElementById("button-div");
    var buttons = document.querySelectorAll("#button-div button");
    document.getElementById("editme").onclick = function() {
        modal.style.visibility = "visible";
        for(var i = 0; i < radios.length; i++) { radios[i].classList.add("show"); }
    };
    document.getElementById("close-button").onclick = function () {
        modal.style.visibility = "hidden";
        for(var i = 0; i < radios.length; i++) { radios[i].classList.remove("show"); }
    };
    for(var i = 0; i < fields.length; i++){ fields[i].style.width = fields[i].clientWidth - 18 + "px"; }
    var max = 0;
    for(var i = 0; i < buttons.length; i++){ max = ( max > buttons[i].clientWidth ? max : buttons[i].clientWidth ); }
    for(var i = 0; i < buttons.length; i++){ buttons[i].style.width = max + "px"; }
    button_div.style.bottom = button_div.getBoundingClientRect().bottom - modal.getBoundingClientRect().bottom + 40 + "px";

</script>

0 个答案:

没有答案