当Blazor服务呈现页面时，它有可能会完全替换原有的HTML而导致页面上已经存在的所有事件被删除，因为Blazor不了解页面的底层JS事件。为了避免这种情况，我们可以使用Blazor的JS Interop功能，直接将事件添加到Blazor事件处理程序中，以确保它们在页面重新呈现时不会被删除。下面是一个使用JS Interop添加事件到Blazor中的示例代码：

1.创建一个JavaScript文件，例如'custom.js”。

2.在该文件中，添加你要绑定的事件，如：

function myCustomEvent() {
   //code here
}

3.使用JS Interop功能将该事件添加到Blazor事件处理程序中。例如：

window.blazorCustomEvents = {
   myCustomEvent: function() {
      DotNet.invokeMethodAsync('MyApplication', 'MyCustomEvent');
   }
}

4.在Blazor组件中添加下面的代码来注册该事件：

protected override async Task OnAfterRenderAsync(bool firstRender)
{
   if (firstRender)
   {
      await JSRuntime.InvokeVoidAsync("registerCustomEvent");
   }
}

5.在Blazor组件的JavaScript部分，将该事件注册到相应的元素中，例如：

async function registerCustomEvent() {
   let button = document.getElementById('myButton');
   button.addEventListener('click', window.blazorCustomEvents.myCustomEvent);
}

注意：这是一个简单的示例代码，你需要根据你的具体需求进行适当地修改。