JavaScript-如何通过循环中的函数传递变量_Javascript_Html_Dom

JavaScript-如何通过循环中的函数传递变量

javascript html dom

JavaScript-如何通过循环中的函数传递变量,javascript,html,dom,Javascript,Html,Dom,以下是我试图实现的目标当用户单击div class='container'时，它将向innerHTML通知他的特殊子对象（p class='primary_key'）没有JQuery index.html <html> <head> <style> .primary_key{ display: none; } </style> <script type=

以下是我试图实现的目标

当用户单击div class='container'时，它将向innerHTML通知他的特殊子对象（p class='primary_key'）
没有JQuery

index.html

<html>
<head>
    <style>
        .primary_key{
            display: none;
        }
    </style>
    <script type="text/javascript" src="script.js"></script>
</head>
<body>

    <div>
        <div class="container">
            <p class="primary_key">1</p>
            <p class="content">content1</p>
        </div>
        <div class="container">
            <p class="primary_key">2</p>
            <p class="content">content2</p>
        </div>
    </div>
</body>
</html>


.主键{
显示：无；
}
1
content1
2
content2

script.js

    window.onload = function(){

    var allContainer = document.getElementsByClassName('container');
    for(var i=0; i<allContainer.length; i++){
        var container =  allContainer[i];
        allContainer[i].onclick = function(e){
            clickContainer(container);
        }
    }
}

function clickContainer(ele){
    var selectedId = ele.getElementsByClassName('primary_key')[0].innerHTML;
    alert(selectedId);
}

window.onload=function（）{
var allContainer=document.getElementsByClassName（'container'）；
for（var i=0；i
发生这种情况的原因是for循环正在更改容器
，因此当单击元素时，它应该向2发出警告，因为容器
是最后一个容器，您可以使用这样的闭包
for(var i = 0; i < allContainer.length; i++){
    (function(container){
        container.onclick = function(e){
            clickContainer(container);
        }
    })(allContainer[i]);
}

我还建议您将addEventListener（'click'，handler）
置于onclick
之上，试试这个-
var allContainer = document.getElementsByClassName('container');
for(var i=0; i<allContainer.length; i++)
{
    var container =  allContainer[i];
    if (typeof window.addEventListener === 'function'){
        (function (e) {
            container.addEventListener('click', function(){
                console.log(e);
                clickContainer(e);
            });
        })(container);
    }
}

var allContainer=document.getElementsByClassName（'container'）；
对于（var i=0；i
请尝试以下方法：
allContainer[i].onclick = function(e){
    clickContainer(this);
}

allContainer[i].onclick = function(e){
    clickContainer(this);
}