单击的元素函数参数的值错误

Value of clicked element function argument is wrong

本文关键字：错误 参数 函数 元素 单击      更新时间：2023-09-26

我有一个循环（从0到5），它为<nav>中的每个元素添加onclick事件。

<nav class="mq-ui-bg tools-bar" style="top:70px;left:20px;width:65px;height:385px;">
<div class="container">
    <div class="tool selected"><div class="pa" style="background-image:url('Images/Icon/Cursor.png');"></div></div>
    <div class="tool"><div class="pa" style="background-image:url('Images/Icon/Select1.png');"></div></div>
    <div class="tool"><div class="pa" style="background-image:url('Images/Icon/Bucket.png');"></div></div>
    <div class="tool"><div class="pa" style="background-image:url('Images/Icon/Rect1.png');"></div></div>
    <div class="tool"><div class="pa" style="background-image:url('Images/Icon/Circle1.png');"></div></div>
    <div class="tool"><div class="pa" style="background-image:url('Images/Icon/Erase.png');"></div></div>
    </div>
</nav>

在它的onclick事件中，调用了一个带有参数的函数，该函数包含元素在我上面添加的导航中的位置编号。

他们的代码很短：

function FixTools(){
    var elqry=ElementClass('tools-bar').getElementsByClassName('tool');
    for(var i=0;i<elqry.length;i++){
        elqry[i].children[0].onclick=
        function(){
                SelectTool(i)
        };
    }
    function SelectTool(n){
        er=ElementClass('tools-bar').getElementsByClassName('tool');
        function fu1(i){
                Attribute( /* This changes the class attribute */
                    er[i],
                    'class',
                    'tool '+
                    ((i==n)?'selected':'un')
                    /* If i value is equal to clicked element position number
                    in my nav, then it will be selected */
                );
        }
        for(var i=0;i<er.length;i++){
                fu1(i);
                /* This loop should unselect all elements
                that are not from n position number in my nav*/
        }
        delete er;
    }
}
FixTools();

所以我的问题是，在我的FixTools()函数中，进入第一个循环，进入onclick事件和进入SelectTool(i)函数的第一个参数，我只收到一个整数，这个：6，数字6。

我做错了什么？

由于误点击，我无法以重复方式关闭，因此这里有一个修复

这是一个经典问题：当调用回调时，i的值为循环结束。

for(var i=0;i<elqry.length;i++){
     (function(i){
        elqry[i].children[0].onclick=
        function(){
                SelectTool(i)
        };
     })(i);
}

这里的想法是将循环体封装在一个函数中，创建一个保存函数调用时i值的范围。

相关文章：