Javascript 使用@ref inside for循环获取元素引用

我试图得到同一个对象在不同位置的位置，通过javascript函数，我应该得到不同的顶部位置，但情况并非如此。脚本代码：

<script type="text/javascript">
    window.ShowAlert = function myFunction(element) {   
    console.log("Hello World.");
    alert(element.offsetTop);
   }
</script>

window.showart=函数myFunction（元素）{
log（“你好，世界”）；
警报（元素偏移）；
}

Index.razor代码：

@inject IJSRuntime jsRuntime

<div>
    @for (int i = 0; i < 10; i++)
    {
        <div @onclick="MemberFunction" @ref="memberRef">Click Here</div>
    }

</div>

@code {

    private ElementReference memberRef;
    void MemberFunction()
    {
        jsRuntime.InvokeAsync<object>("ShowAlert", memberRef);
    }
}

@inject IJSRuntime
@对于（int i=0；i<10；i++）
{
点击这里
}
@代码{
私有元素参考memberRef；
void MemberFunction（）
{
jsRuntime.InvokeAsync（“showart”，memberRef）；
}
}

正如你所看到的，我在同一个分区为做了一个

，他在那里下线。我想从中得到的是，对于每一个
div
发布，它应该给我一个不同的
offsetTop
值，因为他一个接一个地走下去。我如何处理这个问题

为了更好地理解，这里有一个演示。正如您在演示中看到的，单击此处的每个的值都是相同的

感谢您的关注。
编辑：
我相信这是一个bug，所以我创建了一个。如果这不是一个问题或得到修复，我会在这里更新

看着

不要在
for
循环中直接在lambda表达式中使用循环变量（
i
）。否则，所有lambda表达式使用相同的变量，导致所有lambda中的
i
值相同。始终在局部变量中捕获其值（
buttonNumber
，在上例中），然后使用它

因此，看看这个问题，我对它进行了一些调整，并设法使它发挥作用

您需要在
中为
定义一个新变量来保存
i
的值

@inject IJSRuntime jsRuntime

<div>
    @for(var i = 0; i < memberRef.Count(); i++)
    {
        var i2 = i;
        <div @onclick="() => MemberFunction(i2)" @ref="memberRef[i2]">Click Here</div>
    }
</div>

@code {

    private ElementReference[] memberRef { get; set; } = new ElementReference[11];
    void MemberFunction(int i)
    {
        jsRuntime.InvokeAsync<object>("ShowAlert", memberRef[i]);
    }

}

@inject IJSRuntime
@对于（var i=0；i

这是一个工作模式。
无论您在哪个div上，相同元素的可能副本都会传递到memberRef中clicking@ControlAltDel让我检查一下。@BabarBilal你建议做什么？我偶然发现了这个问题，并找到了通过索引的方法：由于某种原因，我无法测试，这行中出现了一些错误：
@LOLJovem错误在于它找不到
i
。我也在努力解决这个问题，只是暂时的，没问题。去吧@LOLJovem男孩。。。这将很难。我编辑了asnwer，代码正常，但它也只发送数组的最后一个元素。我正试图找出原因，但至今没有线索。我相信并理解，我感谢你所做的所有工作。我不担心时间或任何可能出错的事情。慢慢来！祝你好运