在动态链接上调用的最小事件数

Minimum events to call on a dynamic link

本文关键字：小事件 调用 动态 链接      更新时间：2023-09-26

样本：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Dynamic Link</title>
</head>
<body>
    <input type="text" value="http://www.example.com/" id="input">
    <a href="http://www.example.com/" id="link">Linked text</a>
    <script>
        var link = document.getElementById('link'),
            input = document.getElementById('input');
        link.onclick = link.oncontextmenu = link.onmousedown = function () {
            this.href = input.value;
        };
    </script>
</body>
</html>

演示

  • onclick：左键点击和键盘焦点调用+输入
  • oncontextmenu：在右键单击和键盘上下文菜单上调用
  • onmousedown：在Firefox/IE中单击鼠标中键并在链接上拖动到地址栏时调用

问题：

  1. 有没有其他方法可以导航到链接的URL——我忘了为实现完美的可访问性而涵盖的内容
  2. 我可以减少事件的数量吗？还是必须全部使用

您可以使用'onblu'事件来更改链接的href。

var link = document.getElementById('link'),
input = document.getElementById('input');
input.onblur = function () {
    link.href = this.value;
};
相关文章：