Question

关于我需要的内容，但无法在任何地方找到完整的答案。我使用webbrowser控件在我的应用程序中显示一个网站，但我想删除上面的导航，它是一个单独的html元素，类名为“tabs-outer”。我想在我的应用程序中执行此操作，而不是在主页的CSS中，因为它是为了显示移动设备的内容而我只想在我的应用程序中显示在没有它的webbrowser控件中以及桌面/移动网站上它仍然可见，就像它一样。

我发现了一些java脚本代码，比如“$（'＃mydiv'）。allBut（）。hide（）;”我知道我必须添加像“$（'。 tabs-outer'）。allBut（）。hide（）;“但是在哪里？！我不知道，在哪里输入，如何在应用程序中调用它？！我需要更多信息。我找到了一个2岁的帖子，但没有确切的信息。

如何以及在何处使用此javascript，是否可以将其添加到应用程序中，所以我在运行时将其称为此脚本？！任何帮助？我是一个新手，所以我对javascripts一无所知，而且从windows phone和c＃中一无所知。

这是我现在使用它的方式：

protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
    {

        String url = NavigationContext.QueryString["url"];
        if (!String.IsNullOrEmpty(url))
        {
           WebBrowser.Navigate(new Uri(url));
        }

    }
    private void WebBrowser_LoadCompleted(object sender, NavigationEventArgs e)
    {
        WebBrowser.InvokeScript("RemoveNav");
        SystemTray.SetProgressIndicator(this, null);
        WebBrowser.Visibility = Visibility.Visible;
    }

我在标题的网页上添加了一个脚本，如下所示：

<script type="text/javascript">
function RemoveNav() 
{ 
$('.tabs-outer').not(this).hide() 
}
</script>

它的工作原理但是，我必须将webbrowser控件的可见性设置为折叠以便加载页面 - “隐藏”我想要的元素然后make可见。但我需要一些东西来拦截这个元素的加载，但只能在我的Windows手机应用程序的web浏览器控件中。

Answer 1

您提供了jQuery源代码。 jQuery是开源的，可以免费下载和使用。有关jQuery的信息，请查看此站点：http://learn.jquery.com/

您的确切答案在此处找到并解释：http://learn.jquery.com/using-jquery-core/document-ready/

实际上，在页面加载后，代码将会运行。您需要的代码在这里：

<script>
// A $( document ).ready() block.
$( document ).ready(function() {
    $('.tabs-outer').hide();
});
</script>

您需要将此代码作为javascript包含在您的网页中。要使用该代码，您还需要在html页面的head部分中包含以下行。

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

这将加载jQuery插件，该插件将解释您的脚本并隐藏所有将其类设置为“tabs-outer”的div。

祝你好运！

Answer 2

我添加了这个新答案，因为在某些情况下，对于某些用户，我之前的答案就足够了。

这个问题可以用CSS解决。您从移动设备应用加载页面并可以访问标题部分。考虑到这一点，您可以从那里设置div的样式。

使用！important 将覆盖其他规范，但如果css已经使用！important（我非常怀疑），则必须确保您的样式位于页面样式之后。考虑到这一点，尝试在head元素中添加以下代码：

<style>
    .tabs-outer {
        display: none !important;
    }
</style>

这将彻底删除你的div。

更新：为所有设备隐藏它们并将其显示为非wp

第1步：在标题部分添加样式

<style>
    .tabs-outer {
        display: none;
    }
</style>

步骤2：在jQuery API的标题部分添加导入

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

第3步：在标题中添加代码

<script type="text/javascript">
$(document).ready(function(){
    if(!navigator.userAgent.match(/IEMobile/i) && !navigator.userAgent.match(/Windows Phone/i)){
        $(".tabs-outer").show();
    }
});
</script>

就是这样。桌面更快，因此它应该加载元素并足够快地显示它们。

* *更新：在CSS中使用媒体查询和！important隐藏您需要的内容并自定义显示

您可以在CSS中添加以下代码，以最有效的方式解决问题：

@media only screen
and (min-device-width : 160px)
and (max-device-width : 640px) {
    .tabs-outer {
        display: none !important;
    }
    html {
        font-family : "Palatino Linotype";
        font-size : 12;
        font-color : #98AFC7;
    }

    .........

}

资源：http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

您现在可以保留自定义样式。对不起，我第一次没有得到它，但是自从我在网站上工作以来已经很久了。

请提供反馈。再次： - ）

如何隐藏Windows手机webbrowser控件中的html元素

2 个答案: