iOS 上的 <a href="url"> 和 window.location = "url" 有什么区别？答案

【问题标题】：What’s the difference between <a href="url"> and window.location = "url" on iOS?iOS 上的 <a href="url"> 和 window.location = "url" 有什么区别？
【发布时间】：2011-08-16 05:16:44
【问题描述】：

我有一个在包括 iPad 在内的移动设备上运行的 HTML 5 应用程序。我想创建一个指向非 HTML 文件的链接，并打开适当的应用程序来处理该文件。这些文件是 .acsm 文件，可以在 Bluefire 中打开。

如果我将链接创建为一个简单的<a href="url"> 标签，它就可以工作。

如果我改为使用 Javascript 来设置 window.location，它就不起作用。 iPad 会弹出一条警报，提示“下载失败：无法下载此文件”。

我尝试过其他文件类型，但没有发现任何结论。简单链接和 Javascript 技术有什么区别？我可以让 Javascript 代码和链接做同样的事情吗？

如果特定的 Javascript 细节很重要，我会用 jQuery 这样做：

$('.native-launch').live('click', function (evobj) {
  var there = $(evobj.target).attr('href');
  window.location.href = there;
  return false;
});

HTML 看起来像：

<span class="catalog-list-button native-launch" href="url">Read in another app</span>

（请注意，这是一个带 href 的跨度，如果有帮助，我可以更改 HTML。）

【问题讨论】：

您是否尝试过使用window.open？
@kei：好主意！不工作。 :( 它与 Javascript 代码相同：“下载失败”
如果你制作了一个加载 URL 的 iFrame 怎么办？ <iframe src="url"></iframe>
我找到了这个。也许是你同样的问题。 stackoverflow.com/questions/4210995/…
您是否在回调中转储了there 变量？尝试使用window.location.assign(there); 甚至setTimeout(function(){window.location.assign(there);}, 50);

标签： jquery ios html browser

【解决方案1】：

试试window.open，传入“_self”作为目标窗口名称。

window.open(there, "_self");

使用“_self”是这里的关键部分，否则弹出窗口拦截器会拦截它。我会对此进行测试，但我没有指向 acsm 文件的链接。

编辑：另外两个想法：

使用“GET”方法和您的 acsm 文件的操作将表单添加到您的页面。排除表单字段，除非它们正确映射到您的 URL。

<form id="acsm" method="GET" action="http://myserver.com/myfile.acsm"></form>

然后只需使用form.submit() 提交您的表单：

document.forms.acsm.submit();

还有另一个想法：在您的服务器上创建一个页面，该页面将服务器端重定向到您的 acsm 文件。然后只需使用通常的location.href = url 到该服务器页面。

【讨论】：

一个有趣的想法，它并没有改变行为。
哦，好吧。值得一试。
这些都是更好的想法。我不知道它们是否有效，但它们看起来很有希望。

【解决方案2】：

创建一个新的a标签并使用jquery点击它：

$("<a />").attr("href", there).click();

这种情况下的a标签不会被添加到DOM中，只会用来模拟点击。

【讨论】：

嗯，有趣的想法。当我尝试这个时，看起来点击事件会通过许多其他 div 冒泡，沿途触发事件？
是的，我犯了一个错误。之前有 $("a") 会选择页面上的所有链接并单击它们。

【解决方案3】：

对我来说，这似乎是一个 Safari 错误。如果你写 window.location ：Safari 需要一个 html 文件或它可以实际显示的任何类型的文件。

而当您单击链接时，它会读取内容类型，然后决定在同一窗口中打开它或为其打开应用程序。

我认为您应该尝试使用 url 打开一个弹出窗口。理论上应该可以的。

【讨论】：

如果您所说的“弹出窗口”是指 window.open，我只是尝试过，但没有帮助。

【解决方案4】：

使用 JS 函数window.location，浏览器希望使用浏览器而不是任何其他程序打开文件。但是使用 A-Tag，您可以链接到某些东西。这可以是任何文件。如果浏览器不知道文件的类型，浏览器会弹出一个提示以下载文件。例如，如果文件是 HTML 文件，则浏览器会打开文件并显示它。

要下载带有 JS 的文件，这里是 link。

【讨论】：

【解决方案5】：

如果某种类型的屏幕阅读器试图解析您的页面，我认为链接会更好。如果您的导航是用 javascript 编写的，那么这样的内容将无法告诉视障用户发生了什么。

顺便说一句，而不是来自您的事件处理程序的return false;。做evobj.preventDefault()，这是停止活动冒泡的首选方式。

【讨论】：

感谢有关 preventDefault 的提示，但如果我将其放入并删除我的“return false”，则行为会发生变化，看起来事件会一直冒泡到外层 div。
如果您是从其他更高级别的元素处理它，您可以使用event.isDefaultPrevented() 来检查您是否应该对其采取行动。不过在你的情况下听起来不像......

【解决方案6】：

根据HTML5 spec，span元素只能有global attributes，不包括href。因此，从属性中获取的值可能格式不正确或与 window.location.href 接受的类型不兼容。我不确定这是否与问题有关。

您是否尝试分配像window.location.href = "http://example.com/file" 这样的常量字符串？

【讨论】：

【解决方案7】：

如果这是 iOS 的错误，请模拟点击链接。不像 memical 的解决方案，这不会冒泡：

var a = document.createElementNS("http://www.w3.org/1999/xhtml", "a");
a.href = your_url_here;
var click = document.createEvent("Event");
click.initEvent("click", false /*bubbles*/, true /*cancellable*/);
a.dispatchEvent(click);

【讨论】：