Question

我有一个脚本给按钮一个特定的标识<button id='myBtn$i'>Open Modal</button>，$ i跟着for循环。使用该特定ID我应该能够使用相同的$ i <div id='myModal$i' class='modal'></div>打开特定模态。有了这个javascript

<script>
var modal = document.getElementById('myModal$i');

var btn = document.getElementById('myBtn$i');

var span = document.getElementsByClassName('close')[$i];

btn.onclick = function() {
    modal.style.display = 'block';
}

span.onclick = function() {
    modal.style.display = 'none';
}

window.onclick = function(event) {
    if (event.target == modal) {
        modal.style.display = 'none';
    }
}
</script>

但它没有成功，任何人都可以帮助我吗？谢谢！

Answer 1

试试这个：

将变量声明为全局变量。并使用 addEventListener()

 var modal;
    var btn;
    var span;
    for(var $i=0; $i<23; $i++){
     modal = document.getElementById('myModal'+$i);
     btn = document.getElementById('myBtn'+$i);
     span = document.getElementsByClassName('close')[$i];

    btn.addEventListener("click", function() {
        modal.style.display = 'block';
    })
    span.addEventListener("click", function() {
        modal.style.display = 'none';
    })
}
    window.onclick = function(event) {
        if (event.target == modal) {
            modal.style.display = 'none';
        }
    }

打开特定ID的模态

1 个答案: