如何使CefSharp WinForms控制滚动页面到链接

Question

所以这是在WinForms应用程序中使用CefSharp的场景。 我们在页面中有两个信息页面URL和一个链接URL。 我们想要加载页面 - 轻松完成，并让CefSharp显示链接所在页面的区域。这就是cefsharp会自动滚动到该链接在DOM中的页面上的正确位置。

最简单的方法是什么？

Answer 1

不确定您使用的是哪个版本，我能够使用CefSharp的latest stable version（47.0.0）解决此问题。

首先为FrameLoadEnd事件添加处理程序：

browser.FrameLoadEnd += OnBrowserFrameLoadEnd;

处理程序如下：

private void OnBrowserFrameLoadEnd(object sender, FrameLoadEndEventArgs frameLoadEndEventArgs)
{
    if (frameLoadEndEventArgs.Frame.IsMain && frameLoadEndEventArgs.Url == pageUrl)
    {
        frameLoadEndEventArgs.Browser.MainFrame.ExecuteJavaScriptAsync(
            "(function() { var el = document.querySelector('a[href=\"" + linkUrl +
            "\"]'); if(el) { el.scrollIntoView(); } })();");
    }
}

两个常数是：

private const string pageUrl = "http://stackoverflow.com/";
private const string linkUrl = "http://stackexchange.com/legal";

每当我们导航到pageUrl中的网站时，我们都会在加载的文档中调用JavaScript函数。它使用querySelector选择href属性等于linkUrl的第一个元素。如果有这样的元素，那么我们就会调用scrollIntoView()方法。

当您访问stackoverflow.com时，此特定示例将以下链接滚动到视图中。

我使用CefSharp Minimal Example作为构建我的POC的起点。 我上传HERE进行检查。

重建项目，启用包恢复，因此它应该获得所有必需的包。之后你可以运行它。将stackoverflow.com输入地址栏，按Enter键，加载后，视图应向下滚动。