Internet Explorer 8

网页快讯、存储和加速 Web 应用程序的新功能

Daron Yöndem

代码下载可从 MSDN 代码库
浏览代码联机

本文讨论:

  • Web 扇区
  • 加速键
  • DOM 存储
  • AJAX 导航
本文涉及以下技术:
AJAX JavaScript

本文基于 Internet Explorer 8 的预发布版本。如更改,恕所有信息。

内容

定义与 Web 扇区的页面区域
过期和更新频率
加速键
搜索建议
AJAX 导航
DOM 存储
脱机和联机工作模式
XMLHttpRequest 时间出
wrap-up

Internet Explorer 8 代表该产品的演变中的一个主要步骤。它提供新的最终用户功能 (例如 Web 扇区、 加速键和搜索的建议,并还与其使更多的高级开发人员功能,例如 AJAX 导航和 DOM 存储。

此文章中, 我看到这些功能,以查看如何 Internet Explorer 8 可以方便生命开发人员和用户是一样的详细信息。您将看到如何这些新功能允许您定义的页面部分控制其更新频率和过期,提高用户的搜索和导航体验和许多更多。

定义与 Web 扇区的页面区域

Web 扇区可以为部分剪切网页,以便您可以显示和更新您感兴趣,部件。Web 扇区可以是一个方便的解决方案用户想要的网站中执行更新,但不想使用 RSS 阅读器。RSS 阅读器可以为某些最终用户有点复杂,并且并不总是适用。

Web 扇区是网页的以编程方式定义的部分,用户发现通过将其鼠标移动该扇区上方,或单击工具栏上的"订阅 Web 扇区"按钮。图 1 显示了这操作中。

fig01.gif

图 1 Discovering Web 进行切片的悬停

后订阅 Web 扇区,用户将能够看到在 Internet Explorer 8 收藏夹栏上的扇区标题。Internet Explorer 将保持连接联机源和通知更新用户通过使扇区标题文本加粗。当您单击该标题上的时, 该扇区的内容将显示弹出式窗口中,如 图 2 所示。

fig02.gif

图 2 查找 Web 扇面中的一个拍卖上最新的 Bid

Web 扇区的一个主要优点是用户不需要保留以便在网站上跟踪更改刷新网页。此外,根据如何为您的 Web 扇区结构数据源,它们有助于节省 Web 服务器上的资源,因为更新将仅相关数据,不是整个页。此外,通过 Web 扇区您的系统可以提供有关用户如何访问可以进一步影响设计决策 Web 页的不同部分更深入的统计信息。

如我之前提到的 Web 扇区预定义由开发人员。那么,如何您定义这些部分?首先,您要将 HTML div 元素标记为 Web 扇区容器使用 hslice 类名称。hslice 元素将包含的定义您的 Web 扇区所需所有其余的部分。下面是空的 Web 扇区定义:

<div class="hslice" id="ProductID1">  </div>

每个 Web 片段必须唯一的 ID,因为这是 Internet Explorer 如何区分从其他页上。 如果用户订阅后,将更改 Web 扇区 ID,Internet Explorer 不能再找到它,将无法无法更新收藏夹栏上的内容。

每个 Web 片段应包含的元素来标识该扇区的标题,; 标题由 CSS 类项-标题标识。 收藏夹栏和源的发现命令栏菜单上,将显示此内容。 当 Web 扇区更新本身可以如果愿意更改项标题文本。

若要完成创建我不得不将只有一个多个元素添加我第一个 Web 扇形: 该条目的内容。 我有 Web 扇区和定义标题,但我没有向用户显示任何内容。 通过应用 CSS 类项-内容显示给用户的内容,因此让我们定义 Web 扇区内容:

<div class="hslice" id="ProductID1">
  <h1 class="entry-title">
  Brand New Product!</h1>
  <div class="entry-content">
    <p>
    This is the product
    definition.</p>
  </div>
</div>

图 3 显示了我的 Web 切片定义。 调用 ProductID1,我 Web 扇区具有标题和内容。

fig03.gif

图 3 A 简单的 Web 切片

可以将进一步丰富添加到可视元素和嵌入式 Web 扇区用户体验 (或全局) CSS 样式。 唯一的限制是允许没有脚本或 ActiveX 控件 (包括 Silverlight)。 如果您需要 ActiveX,您需要使用替代显示源。 Web 扇区的项内容的容器元素上定义的替代显示源。

如下所示,不必将项内容元素的内部内容。 您只是重定向 Web 扇区和通知内容将来自另一个 URL 的浏览器:

<div class="hslice" id="ProductID2">
    <h1 class="entry-title">
        Brand New Product</h1>
    <div class="entry-content" href="http://www.contoso.com/web_slice/
        alternative_display.aspx?ID=2">
    </div>
</div>

这样您将能够跟踪每个 Web 片段将更新的次数和多少用户是通过只跟踪显示源页执行的扇区。 此外,目标 alternative_display.aspx 页中您允许使用 ActiveX 控件。

过期和更新频率

有时您需要及时过期,即使该用户是脱机并且 Web 扇区不能获取更新的 Web 片段。 这更是如此的在线拍卖或联机销售市场活动的站点。 可以通过添加 endtime 类名和一个 HTML 缩写元素内适当的日期时间值中设置 Web 扇区的停止时间如下:

<div class="hslice" id="ProductID1">
  <h1 class="entry-title">
    Brand New Product!</h1>
  <div class="entry-content">
    <p>
      This is the product definition.</p>
        <p>
          This is the end time:
          <abbr class="endtime" title="2008-10-12T11:00:00-12:00:00">
            12:00</abbr></p>
  </div>
</div>

用户将能够通过右键单击收藏夹栏 Web 扇区标题,并单击属性命令来设置更新频率。 如 图 4 所示,允许自定义日程安排。

fig04.gif

图 4 用户可以设置 Web 切片的更新频率

除了用户定义的设置可以以编程方式通过提供 (Ttl) 值的生存时间指定频率:

<div class="hslice" id="ProductID6">
  <h1 class="entry-title">
    Brand New Product!!!!</h1>
  <div class="entry-content">
    <p>
      This is the product definition.</p>
    <div class="ttl" style="display: none;">
      15</div>
  </div>
</div>

若要指定频率,我有 CSS 类 Ttl 与内容 15 创建 DIV 元素。 这将通知浏览器检查此 Web 扇区的内容可能更新每隔 15 分钟。 请注意作为设计选项我设置 DIV 元素的可见性为不可见通过将显示 CSS 值设置为无。

如前所述,您可以使用可选的显示源,但有时可能会用于只需从外部数据源中获取其数据的 Web 扇区。 使用外部数据源时,您有两个的选择。 一种方法是在另一页上, 使用外部的 Web 扇区您将看到在下一个代码段。

<div class="hslice" id="ProductID10">
    <div class="entry-title">
        Product Name
    </div>
    <a rel="feedurl" href="http://www.contoso.com/
        external.aspx#ProductID1"></a>
</div>

此 Web 扇区定义为提取从 external.aspx 的另一个 Web 片段。 其 ID,即 ProductID1 作为某个锚点附加到的 URL 找到目标 Web 扇区。 rel 属性定位点标记上的指示 Internet Explorer 以使用为 Web 扇区数据源而不是显示在 div 标记中的内容的定位点标记的 URL。

第二种方法是使用外部 RSS 源。 Internet Explorer 将始终使用 RSS 源中的第一个项目,并从传入 RSS XML 显示项内容:

<div class="hslice" id="ProductID10">
    <div class="entry-title">
        Product Name
    </div>
    <a rel="feedurl" href="/slicefeed.xml"></a>
</div>

此处 Web 扇区有针对可轻松地替换泛型处理程序根据某些参数的输出 XML 的一个 XML 源的 feedurl 定位点。 XML 源在我们的示例所示:

<?xml version="1.0" encoding="utf-8" ?>
<rss version="2.0">
  <channel>
    <title>WebSlice RSS</title>
    <ttl>120</ttl>
    <item>
      <title>Product Name Here</title>
      <description>HTML &lt;b&gt;codes&lt;/b&gt; can be used</description>
    </item>
  </channel>
</rss>

而不是项内容 HTML 代码中定义的我们 Web 扇区设置的可以 XML 数据源中定义它们。 在上面的代码 XML 源 Web 扇区 Ttl 和标题属性提供值。 在说明标记可以包含 Rich HTML 而不会产生任何问题。

加速键

加速键存在浏览 Web 时进行更快并且更加自动化的常见任务。 是例如考虑频率复制和粘贴来自 Web 站点的内容,到另一个。 假设您只需找到在公司的 Web 站点所查找的地址,并且现在您需要行车路线。 复制地址,启动 Live 地图 Web 站点并将粘贴到该地址中。 可以自动执行此过程使用加速键。

图 5 显示了当用户单击地址上找到映射上的某个位置的快捷键。 编写您自己的快捷键是简单的。 为开发人员,您只需要定义哪些您快捷键将不使用 XML OpenService 说明文件。 让我们深入 OpenService 说明格式的详细信息。 下面显示基本的 OpenService 说明文件:

<?xml version="1.0" encoding="utf-8" ?>
<openServiceDescription xmlns="http://www.microsoft.com/schemas/
  openservicedescription/1.0">
  <homepageUrl>http://www.contoso.com/</homepageUrl>
  <display>
    <name>Translate it with Contoso</name>
    <icon>http://www.contoso.com/favicon.ico</icon>
  </display>
  <activity category="translate">
    ...
  </activity>
</openServiceDescription>

fig05.gif

图 5 Live 映射快捷键提供即时位置搜索

快捷键的主属性会将 homepageUrl、 显示和活动标记。在 homepageUrl 是您提供的服务的 URL。其他标记和设置中使用的所有 URL 应将在同一个域都用作该 homepageUrl。显示标记集可视方面,Internet Explorer 上的加速键的命令按钮的右键单击菜单。当用户右键单击在页面上时, 该加速键会显示由其名称和图标中。

Activity 元素定义加速键提供服务。在此示例中,该加速键将提供一个转换活动。您可以控制 Internet Explorer 如何分组在加速通过像添加到添加链接) 的不同类别上下文菜单,(向博客远程服务) 的博客中定义 (以查找定义)、 映射到查找映射) 和转换为转换选定的文本)。您还可以定义自己的类别。类别定义,建议的规则是它们应动词和泛型,为了使其他加速开发人员,使用相同的类别。

现在是以定义我们活动标记我们 activitiyActions 时间。此处可以看到一个 activityAction 上下文值为所选内容:

<activityAction context="selection" >
  <preview action="http://www.contoso.com/translateacc.aspx" method=" get" >
    <parameter name="word" value="{selection}" />
  </preview>
  <execute action=" http://www.contoso.com/translate.aspx " method=" post" >
    <parameter name="word" value="{selection}" />
  </execute>
</activityAction>

上下文属性是一个 activityAction 的关键组件。 上下文定义时此操作将可用。 如果该加速键没有提供适用于当前上下文的操作,则无法为 Internet Explorer 中的加速键的菜单上可见。 当前的上下文选项是选定内容和链接。 如果上下文为所选内容,用户需要选择文本,然后才能使用您的加速键转到快捷键菜单。 如果上下文是链接,用户应该右键单击以启动该操作的超链接。

每个 activityAction 中可以有一个执行和预览定义。 执行当用户单击加速键菜单中的在快捷键命令时启动。 当用户将鼠标悬停菜单上,快捷键命令时,会启动预览操作。 这两个预览和执行标记可以有一个操作 URL 和方法。 您可以使用 GET 或 POST 作为的数据传输方法。

参数是为每个名称 / 值对形式的操作定义的。 值自动来自在括号中的关键字。 对于是实例 {选择} 意味着用户选定的文本将关联参数的值。 可能的值的关键字的列表如 图 6 所示。

图 6 关键字选项
名称 说明
documentDomain 当前页的域地址。
documentTitle 当前页的标题。
documentUrl 当前页的完整 URL。
链接 如果用户单击链接,这将提供链接的完整地址。
linkdomain 如果用户单击链接,这将提供链接的域地址。
linkRel 如果用户单击链接,这将提供了链接的 rel 属性。
linkText 如果用户单击链接,这将提供链接的文本。
所选内容 在当前页上所选的文本。

预览窗口的工作方式与一个 IFrame 这就意味着您可以使用任何类型的交互在预览窗口内类似。 是更适合于设计特定的接口和区别预览,并执行操作的 URL。

最后一个 OpenService 说明文件,例如如 图 7 所示。 现在的时候允许访问者我们的网站的她的 PC 上安装此快捷键。 下面是需要安装该加速键的脚本:

<div>
    <input id="Button1" type="button" 
    value="Click to Install" 
    onclick="window.external.AddService('myaccelerat.xml');" /> 
</div>

图 7 </a0>-最终 OpenService 说明文件

<?xml version="1.0" encoding="utf-8" ?>
<openServiceDescription xmlns="http://www.microsoft.com/schemas/
  openservicedescription/1.0">
  <homepageUrl>http://www.contoso.com/</homepageUrl>
  <display>
    <name>Translate with Contoso</name>
    <icon>http://www.contoso.com/favicon.ico</icon>
  </display>
  <activity category="translate">
    <activityAction context="selection" >
      <preview action="http://www.contoso.com/translate.asp">
        <parameter name="Word" value="{selection}" />
      </preview>
      <execute action="http://www.contoso.com/translate.asp">
        <parameter name="Word" value="{selection}" />
      </execute>
    </activityAction>
  </activity>
</openServiceDescription> 

AddService 方法获取我们 OpenService 描述 XML 文件的 URL,并开始安装。为了查找出如果加速键已安装了您可以调用 isServiceInstalled 方法。

搜索建议

Internet Explorer 7.0 引入了一种称为搜索提供程序的新功能。用户是能够将不同的搜索提供程序集成到他们的浏览器,并使用搜索栏轻松导航到其最喜欢的搜索引擎。这是可能因为基于 XML 的 OpenSearch 规范文件。Internet Explorer 8 进一步改进搜索一项名为搜索建议的功能。顾名思义,浏览器将在您键入与搜索关键字时提出建议。

在用户键入时在浏览器转到选择的搜索建议提供程序,并请求与搜索关键字的建议。生成的数据立即向用户显示创建更好的搜索体验 (请参见 图 8 )。

fig08.gif

图 8 轻松地搜索关键字,而不从当前页导航的 Access 建议

之前了解搜索建议的工作原理的详细信息,您需要搜索提供程序。搜索提供程序由三个主要元素组成: 名称、 一个搜索 URL 和一个图标。这些是所有定义 OpenSearch 规范 XML 中。下面是全功能搜索提供程序不搜索建议面向 Internet Explorer 7.0:

<?xml version="1.0" encoding="UTF-8"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
  <ShortName>Contoso Search</ShortName>
  <Url type="text/html" template="http://www.contoso.com/?key2search=
    {searchTerms}"/>
  <Image height="16" width="16" type="image/icon">
    http://www.contoso.com/favicon.ico</Image>
</OpenSearchDescription>

ShortName 标记包含搜索提供程序名称,并在 URL 标记定义的搜索引擎搜索路径。 URL 模式中的 searchTerms 关键字将替换由用户编写用搜索关键字。 最后,图像标记指向图标文件搜索提供程序。

为了安装搜索提供程序,用户将需要单击页面上的 HTML 元素或发现通过 Internet Explorer 8 的搜索框搜索提供程序。 以作为加速键类似方式搜索提供程序可以安装使用 window.external.AddSearchProvider JavaScript 函数:

<a href="#" onclick="window.external.AddSearchProvider('http://
    www.contoso.com/provider.xml')">  Add Search Provider  </a>

请注意 AddSearchProvider JavaScript 函数需要 OpenSearch XML 文件 URL 作为参数以初始化安装进程。

作为显式对 OpenSearch XML 文件的替代方法,您可以让浏览器浏览您的网页并发现您的搜索提供程序。 若要使您的搜索提供程序发现,将要将隐藏的链接应用于 HTML 的页标头中 OpenSearch XML 文件。 下面是隐藏的链接搜索提供程序:

<link title="Contoso Search" rel="search" type="application/
opensearchdescription+xml" href="http://www.contoso.com/provider.xml" />

链接的标题是在浏览器中显示的搜索引擎的名称。 隐藏链接的关系和类型属性应是完全相同我此处所使用。 这是如何在浏览器知道它是搜索提供程序链接。 最后,href 属性包含 OpenSearch 描述 XML 文件 URL。

既然您已准备好您搜索提供程序,可以继续,并向其添加搜索建议。 首先,需要修改 OpenSearch 描述 XML 文件,并指定搜索建议数据源:

<?xml version="1.0" encoding="UTF-8"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
  <ShortName>Contoso Search</ShortName>
  <Url type="text/html" template="http://www.contoso.com/?key2search=
    {searchTerms}"/>  
  <Url type="application/x-suggestions+json" template="http://
  www.contoso.com/json.ashx? key2search ={searchTerms}"/>
  <Image height="16" width="16" type="image/icon">http://
    www.contoso.com/favicon.ico</Image>
</OpenSearchDescription>

此处将看到我已经向以前的搜索提供程序说明文件中添加其他一行的 XML,用不同的类型值的新 URL 标记。 为了使用搜索的建议功能,您需要一个可以计算搜索关键字和用户提供服务,并能够提供适当的建议列表。

列表可以提供 XML 还是 JSON 格式。 下例所我已添加到建议服务使用 JSON 中指针。 但是,我可以轻松地占用下面的 XML 的基于 XML 的服务:

<Url type="application/x-suggestions+xml" template="http://
  www.contoso.com/xml.ashx? 
  key2search  ={searchTerms}"/> 

有 XML 与 JSON 数据源之间的重要差异。 JSON 数据源可以提供建议,包括建议的结果,每个结果,并且如果需要的 URL 的一个说明的列表。 下面是一个示例:

["con",
["contoso soft", "contoso books", "contoso rent"],
["software company", "book store", "rent a car"],
["http://www.contoso.com/soft", "http://www.contoso.com/books", "http://www.contoso.com/rent"]]

fig10.gif

图 10 A 示例搜索建议列表

Internet Explorer 8 将动态提取 JSON 数据,并立即显示记忆式键入列表。 应注意搜索关键字应包括从提供程序返回数据。 第一个元素在我们的 JSON 示例包含我们搜索关键字"F"。

如果要使用 XML 格式为 Internet Explorer 中提供搜索建议列表,您将能够选择使用分隔符,拆分结果,并提供 Visual 建议在结果列表的标题。

首先我将提供搜索建议列表只有两个结果和一个分隔符。 图 9 中的 XML 响应包含查询标记中提交的关键字,并提供两项内容标记中。 节标记有标题,并且每个项目具有文本、 说明和导航的 URL。

图 9 搜索建议的 XML

<SearchSuggestion>
    <Query>con</Query>
    <Section title="First Section">
        <Item>
            <Text>Result 1</Text>
            <Description>Description 1</Description>
            <Url>http://www.contoso.com?id=1</Url>
        </Item>
        <Separator title="Others"/>
        <Item>
            <Text>Result 2</Text>
            <Description>Description 2</Description>
            <Url>http://www.contoso.com?id=2</Url>
        </Item>
    </Section>
</SearchSuggestion>

可以使用分隔符标记的标题来提供不同的结果在搜索建议框中的列表。 当用户单击列表中的建议的项目时,将使用 URL。 图 10 中, 可以看到 XML 数据在 Internet Explorer 8 中的显示方式。

除了搜索建议列表,传统视图可以增强用户体验,并提供每个建议的图像使用的图像。 您需要执行所有是并在适当的项目标记中添加一个图像标记如下:

<Item>
<Text>Result 1</Text>
<Description>Description 1</Description>
<Url>http://www.contoso.com?id=1</Url>
<Image Source=http://www.contoso.com/image.jpg
    alt="A picture is worth thousand words" width="70"></Image>
</Item>

AJAX 导航

AJAX 的主要组件 Rich Internet 应用程序 (RIA) 并将保留,只要是在使用的 HTML。 可以使用 AJAX 来更新 UI 的无整个页面刷新和服务器客户端周期的每个用户操作。 但 AJAX 有其缺点。

当您使用 AJAX 修改您的网页内容时您会发现在地址栏不会更改。 这样做很有意义。 但如果用户要有当前页的状态说用于等将添加到收藏夹的一个一致的 URL? 如果用户单击其浏览器中的,上一步按钮? 她将发送到用户之前访问的网站。

由于某种原因必须反映 URL 不刷新 Web 站点。 输入片断标识符。 片断标识符不会完全它听起来那样,标识页的一部分的状态。

每个 URL 可以有一个片断标识符 ; 您只需将井号"#"追加到的 URL (是例如 www.contoso.com/default.aspx\#5 的末尾。 如果您在 # sign 后更改内容,则不会刷新网页但浏览器的历史记录日志将记录更改,并提供来回的导航。

在 Internet Explorer 8,使用 window.location.hash 属性和新 hashChanged 事件提供此功能。 每当您更改 window.location.hash 属性,地址栏将获取更新,并且 hash 属性的内容将放置在 # sign 之后。 当用户尝试导航到另一个网页通过浏览器按钮时,hashChanged 事件将触发,并且提供目标页 # sign 后即值目标哈希值。

让我们创建一个简单的 Web 站点与一个 WebMethod,以便服务 AJAX 调用。 此示例 Web 站点包含的 HTML 按钮和 DIV 元素。 每次用户单击 HTML 按钮 DIV 元素的数字内容将发送到在 WebMethod:

<form id="form1" runat="server">
    <asp:ScriptManager EnablePageMethods="true" ID="ScriptManager1" 
        runat="server">
    </asp:ScriptManager>
<div>
    <input id="Button1" onclick="GetNext();" type="button" value="button" />
    <div id="content">0</div>
</div>
</form>

为了调用服务,添加以下 JavaScript:

function GetNext() {
    PageMethods.GetNext($get("content").innerHTML, Done);
}
function Done(sender) {
    $get("content").innerHTML = sender;
    window.location.hash = sender;
}

以递增该整数参数并向 AJAX 调用方返回该页的源代码文件中,最后,创建将 WebMethod:

<System.Web.Services.WebMethod()> _
Public Shared Function GetNext(ByVal x As Integer) As Integer
    Return x + 1
End Function

名为 GetNext 该 JavaScript 方法向服务器发出的 XMLHttpRequest。 GetNext 方法的该参数是只需的内容 DIV 元素和一个回调方法。 完成,将回调方法作为服务响应的结果调用的新值将只放回插入 DIV 元素。

此处提供有趣的点。 修改与新的内容的网页之后, 我分配唯一的标识符给 window.location.hash 属性以确定我的网页的当前状态。 对于此简单的示例值是相同的数目我的 DIV 元素中显示。 在更改 hash 属性后如果您看浏览器历史记录中您会发现现在列出存在的新条目。

每当用户在浏览器历史记录中导航回或转发,hash 属性将被传递回给处理 onhashchange 事件的一个 JavaScript 函数。 这被通过下面的代码行来完成:

<body onhashchange="HashChanged();">

只要用户定位向后或向前,并且 Internet Explorer 8 会更新 window.location.hash 属性根据为浏览器历史记录中的值,将调用此函数。 这使我能够轻松地获取哈希值,并更新我的页面是否该操作是使用哈希数据本身,更新页,如下所示,或是否涉及从基于存储在哈希值的唯一标识符的服务器请求数据一样简单:

function HashChanged() {
    $get("content").innerHTML = window.location.hash;
}

DOM 存储

当前,如果需要将数据存储在客户端、 唯一的标准的方法和旧的备用上,是使用 document.cookie。 遗憾的是,此方法不只是灵活和强大的今天的联机应用程序。 最重要的 Cookie 的缺点之一是 4 KB 的限制。 Internet Explorer 8 有一个答案,DOM 存储。

DOM 存储是 HTML 5 工作草稿的组成部分,,客户端提供大量的数据存储 (大约 10MB)。 此存储可能会这么大部分因为数据不发送每个请求给服务器按原样使用 Cookie。 此外,在 localStorage 永不过期。

为了存储和检索 DOM 存储的数据,您需要是键 / 值对。 localStorage JavaScript 类提供方法 setItem、 getItem 和 removeItem 访问的 DOM 存储的所有功能:

function Save() {
    localStorage.setItem("MyItem", $get("Text1").value);
}
function Load() {
    $get("Text1").value = localStorage.getItem("MyItem");
}

此代码执行相当于属性获取和设置操作 C# 或 Visual Basic 作为后备存储使用 DOM 存储。 首先,保存函数键名为 MyItem 到 DOM 存储 TextBox 的值存储。 然后,加载函数检索数据从 DOM 存储通过提供相同的项名称。

脱机和联机工作模式

像许多 Web 开发人员我已经长时间被做梦每日时我检测如果当前用户正常连接到 Internet,并提供适当级别的功能。 现在,Internet Explorer 8 提供与联机属性窗口的主机 PC Internet 连接的状态。 导航。 在过去,表示用户已选择脱机工作,是否此属性时它现在指示当前用户是否有一个已建立的连接到网络。

除了将联机的属性 Internet Explorer 8 具有现在两个新的回调处理程序 ononline 和 onoffline (请参阅" ononline 事件"和" onoffline 事件"). 当系统失去网络连接,并还原连接时引发 ononline 处理程序,将引发 onoffline 处理程序。 您可以将附加事件侦听程序,并将警告立即有关连接的状态以便您可以提供您的用户了混合的体验在联机和脱机功能。

图 11 显示了网页正文中定义的 ononline 和 onoffline 事件是简单用法。 每次用户获取连接到在的网络将启动联机的 JavaScript 方法。 同样,每次用户断开,脱机方法将触发的网络。

图 11 使用 Ononline 和 Onoffline 事件

<html >
<head runat="server">
    <title></title>
    <script type="text/javascript" language="javascript">
        function Online() {
            alert("I'm online");
        }
        function Offline() {
            alert("I'm offline");
        }
    </script>
</head>
<body ononline="Online();" onoffline="Offline();">
    <form id="form1" runat="server">
    </form>
</body>
</html>

XMLHttpRequest 时间出

Internet Explorer 8 中新的 XMLHttpRequest 具有 TimeOut 属性和 ontimeout 事件。 这使您能够定义将超时的 XMLHttpRequests 和允许向前移动请求 queue.in 中下面的代码的其他请求,请我创建新的 XmlHttpRequest,并设置超时属性和 ontimeout 事件侦听程序:

function GetAReqeust() {
    var MyRequest = XMLHttpRequest();
    MyRequest.ontmeout = TimeOutHere;
    MyRequest.open("GET","http://www.contoso.com/data.xml");
    MyRequest.timeout = 2000;
    MyRequest.send(null);
}
function TimeOutHere() {
    alert("Request to Contoso timed out!");
}

有两个规则实际上应遵循定义超时设置时: 超时事件打开请求和超时属性应设置打开请求后之前应绑定侦听程序。

设计您的 AJAX 应用程序时会遇到的主要问题之一涉及与由于不同的远程域中的服务通信, 同一来源策略.

还有您可以执行一些解决方法,但它们都未能提供您需要: 一个简单和通信的安全方法。 Internet Explorer 8 提供一个新的客户端对象,调用它允许开发人员可以访问远程域,而不要求的实现的 XDomainRequest 一个服务器端代理服务器。

如果远程服务器提供了称为访问的控件的允许的源的 HTTP 头: * 所有其他远程站点将请求数据从当前的网页。 客户端使用 XDomainRequest 对象是作为普通 XmlHttpRequest 相同的。

正如您所看到 Internet Explorer 8 将提供了许多功能,解决许多 Web 开发人员必须被希望长时间解决的问题。 是否是在多个深度集成您的内容和服务浏览器或利用新的浏览器平台服务提供了更加无缝用户体验,Internet Explorer 8 提供了该工具来构建为您的用户的更丰富、 更加无缝体验。

基于土耳其 Deveload 软件的创始人 Daron Yöndem 。 他是 Microsoft 区域总监和 MVP 在 ASP.NET 中。 Daron 是导致 INETA MEA 扬声器部门和的两个 ASP.NET AJAX 书籍的作者的国际扬声器。