0

因为这个主题变成了跨学科（但仍然是关于用户体验），所以我很好奇 javacript 开发人员对此有何看法。

我的网站处理a标签以ajax 请求href开头。#如果请求成功，则将文档哈希更改为适当的。现在我想实现调用内部 js 函数的操作链接，例如转到站点顶部，但我不想javascript:myAction()引用，因为当您通过链接时，大多数浏览器都会显示带有引用 url 的提示。可能我可以使用并成功处理自己的 url 架构action:myAction，但它还不够解决方案 - 用户仍然被暗示有关魔术 url。另一种选择是使用自定义属性action="myAction"，href例如自定义字符串href="Go to top"，但是浏览器兼容性如何？最后的解决方案是使用span样式为执行操作的链接 - 不会提示用户任何 url，但这是链接功能的一部分，建议执行操作（默认为 url）。

什么更好，为什么？

4

3 回答 3

0

我会首先以没有 JS 的用户可以使用它的方式编写所有内容，例如

<a href="#" title="Go to the top of the page">Go to top</a>

然后我会在 DOM 加载后立即使用 JS 对其进行增强。首先添加onclick事件，然后删除href, 以避免任何链接提示（链接以外的任何其他内容可能不会通过任何验证器），最后是一个新的样式属性，光标在悬停时变为指针。

它是非常有用的程序化渐进增强结构的一部分。通过这种方式，我可以获得有效且兼容的代码以及舒适的行为。

于 2012-06-13T12:19:53.467 回答
0 
<script>
if(window.addEventListener)//Chrome, Firefox and Safari
    document.getElementById('myLink').addEventListener('click',function(e){
        var e = e || event;
        e.preventDefault();
        window.location = destiny;
    });
else//IE and Opera
    document.getElementById('myLink').attachEvent('onclick',function(e){
        var e = e || event;
        e.preventDefault();
        window.location = destiny;
    });
</script>
<a href="#" id="myLink">Link</a>
于 2012-05-12T01:51:56.833 回答
0

您应该首先让您的链接在没有JavaScript的情况下工作。那么你就不用担心有人点击了<a href='/customers'>Customers!</a>。它运行良好并且易于访问。一旦达到这一点，您就可以将 JavaScript 放在首位以增强用户体验。如何连接所有这些取决于您 - 假设您想以通用方式处理删除，您可能具有如下所示的链接：

<a href='/customers/2' class='delete'>Delete customer</a>

<a href='/customers/2' data-action='delete'>Delete customer</a>

或者，如果每个链接都是特定的，您可以设置 id 并以这种方式连接它：

<a href='/customers/2' id='delete'>Delete customer</a>

所有这些连接都应该在一个外部 JavaScript 文件中完成。

于 2012-05-12T02:03:17.520 回答