无法将焦点设置在 table 行

Question

我试图在组件初始化时将焦点设置在 table 行上，但在使用 interop

时我得到一个空值

<table  class='table'>
     <thead>
         <tr>value</tr>
    </thead>
     <tbody>          
        @foreach (var elem in this.data) {
           <tr id="@elem.toString()"><td>@elem</td></tr>
     </tbody>
 </table>


@functions()
{
     protected int []data=new int[]{1,2,3,34};
     protected override async Task OnInitAsync() {
                if (data.Length > 0) {
                    var elementName= data.First().ToString();
                    await JSRuntime.Current.InvokeAsync<string>("methods.focus", elementName);;
                }
            }

}

互操作

window.methods={
    focus: function (elementName) { //i get the right id 
            var element = document.getElementById(elementName);//returns null
            element.focus();
        }
}

P.S 在浏览器中调试时，我在 focus 方法中得到了正确的 elementName 但 document.getElementByIdreturns null element.Do 我需要先获取 table 元素然后搜索其中的行 ?

Answer 1

您不能将焦点设置在 td 或 tr 元素上。但是，您可以在 td 元素中放置一个 input 元素，然后设置焦点。

希望这对您有所帮助...

无法将焦点设置在 table 行

Can not set focus on a table row

javascript

interop

blazor