C#-Blazor@onlick how to get HTML元素点击

我目前正在学习C#Blazor框架，我面临一个问题，如何获取我点击的HTML元素

我需要它来获得它在DOM和父HTML元素中的位置

例如，JQuery的经典方式：

$('selector').click(function (event) {
    alert($(this).index());
});

我知道Blazor中有@onclick属性，例如：

<tr @onclick="OnYes">...</tr>

@functions {
    ElementReference inputTypeFileElement;

    public async Task MainTableOnClick(MouseEventArgs e)
    {
        Console.WriteLine("clicked!");
    }
}

。。。
@功能{
ElementReference输入类型文件元素；
公共异步任务MainTableOnClick（MouseEventArgs e）
{
控制台。WriteLine（“单击！”）；
}
}

如何获取被单击的TR HTML元素的索引

---

我的任务是将Windows窗体应用程序转换为Web版本。旧的Windows窗体有DataGridView，它的每一行都有onClick事件和标记对象。单击DataGridView的某些行时，单击该行的get标记对象，并使用它将数据填充到表单上的另一个DataGridView。所以，我需要知道，单击哪一行从某个对象（可以是DataTable，或者更简单地说，数组）获取数据。根据行的索引和数组中的索引，我需要获取填充网页上其他表的数据

所以，第一个表是Clients（名称、姓氏等）

---

当单击了一些带有客户机的行时，我需要获取表中的行（客户机）索引。通过该索引，我将从客户机数组中获取数据。通过查找客户端对象，我计划动态填充页面上的另一个表。

在这种情况下，您可以使用

或

。。。
@代码{
ElementReference输入类型文件元素；
公共无效TrClickedAtIndex（整数索引）
{
WriteLine（$“tr单击了索引{index}！”）；
}
}

如果要获取元素，可以使用

@ref

返回元素，但通常在Blazor中，您对元素不感兴趣（就像在JQuery中一样），而是对它们的相关内容感兴趣

我创建了这个简单的Blazorfidle，它在一个表中列出了三个字符串。它与另一个答案类似，但它显示了一点瑕疵——当从循环或枚举传递值时，您需要分配它

这显示了一个包含三个字符串的表。当您单击一行时，它将从单击的行传递数据项，而不仅仅是索引

    int index = i;
    <tr @onclick="()=> ClickedRow(list[index])" ><td>

int index=i；

---

希望这有助于解决XY问题？你能解释一下为什么首先需要html元素吗？不是XY问题，我需要找到匹配元素集中第一个元素相对于其同级元素的位置——也就是说，如果不传递元素索引（int），就不可能从DOM获得类似Jquery风格的索引在方法参数中？我想知道为什么您实际需要索引，也许有其他方法可以实现您需要的行为，而无需访问索引。我的任务是将Windows窗体应用程序转换为Web版本。旧的Windows窗体有DataGridView，它的每一行都有onClick事件和标记对象。单击DataGridView的某些行时，单击该行的get标记对象，并使用它将数据填充到表单上的另一个DataGridView。所以，我需要知道，单击哪一行从某个对象（可以是DataTable，或者更简单地说，数组）获取数据。基于行的索引和数组中的索引，我需要获取用于填充网页上其他表的数据。好的，我现在就做。使用@，例如：

@foreach（dataGridView1中的var line）{ColLineClicked（col，line）“>@col…

非常有用的提示，在这种情况下使用快速赋值，非常有用的fiddle！我发现这个解决方案比使用JSInterop解决所有问题要好得多。Blazor的整个要点是不必为这些简单问题求助于JS。这应该是公认的答案