Question

我试图单击一个元素并获取offsetTop位置。我正在尝试使用以下javascript代码做到这一点：

window.ShowAlert = function myFunction(event) {   
    console.log("Hello World.");
    alert(event.target.offsetTop);
}

此代码位于我的wwwroot和Index.razor的文件夹中，我有以下代码：

@inject IJSRuntime jsRuntime

<div>
    <Member OnClick="MemberFunction" />
</div>

@code {
    void MemberFunction()
    {
        jsRuntime.InvokeAsync<object>("ShowAlert");
    }
}

运行此命令时，控制台日志会按预期显示，但警报未显示，并且我尝试将警报更改为“ Hello World”，并且工作正常，问题出在event.target。为什么具有offsetTop位置的警报不起作用？

感谢您的关注。

Answer 1

您可以使用@ref将elementRef传递给javascript方法：

@inject IJSRuntime jsRuntime

<div>
    <Member @onclick="MemberFunction" @ref="memberRef"/>
</div>

@code {

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

编辑

您将需要修改javascript：

window.ShowAlert = function myFunction(element) {   
    console.log("Hello World.");
    alert(element.offsetTop);
}

注意

我将OnClick更改为@onclick。

您可以在BlazorFiddle上看到一个演示-> https://blazorfiddle.com/s/61o1g7ef

事件目标在我的blazor项目中不起作用

1 个答案: