如何使用javascript设置默认链接?

Question

我尝试在模态中设置默认链接，但不起作用(我对javascript很陌生(。

这是我的完整代码：

<a href="#my-id" data-uk-modal="{center:true}"></a>
<button class="md-btn md-btn-success" id="openmodal" data-uk-modal="{target:'#my_id', keyboard: false, bgclose: false}" style="display:none !important;"></button>
<div class="uk-modal" id="my_id">  
<div class="uk-modal-dialog">
<div class="uk-modal-header">
<div uk-grid class="uk-grid">
<div class="modal-block">
<h3>Project</h3>
<b>project description, lorem ipsum... <a href="https://www.instagram.com/user/">instagram</a></b>
</div>
<div class="modal-block">
<h3>Terms</h3>
<b>terms description</b>
</div>
<div class="modal-block">
<h3>Cookies</h3>
<b>cookies description</b>
</div>
</div>
</div>
<div class="uk-modal-footer uk-clearfix">
<a id="default-link" uk-tooltip="{title: okay, i accept!; pos: bottom}" class="us--main-button uk-float-right entersite uk-modal-close" href="javascript:void(0)">Accept and enter</a>
<a  id="dont-def" uk-tooltip="{title: I do not agree!; pos: bottom}" class="us--leave-button uk-float-right" href="https://google.com">Deny and leave</a>
</div>
</div>
</div>

<script>
$(document).ready(function(){
$('#openmodal').trigger('click');
})  
</script>
<script>
window.onload = function() {
document.getElementById("default-link").focus();
};
</script>

当我在任何浏览器中打开页面时，默认声明的链接将是第一个(Instagram(...这有什么问题？

Answer 1

该代码在提供链接焦点时有效，但如果按回车键(或单击它(，则不会发生任何事情，因为您已经取消了其操作href="javascript:void(0)"

下面是一个示例，显示focus()确实有效。

单击"运行代码片段"并点击"输入"，您将收到警报。

window.onload = function() {
document.getElementById("default-link").focus();
};

<div class="uk-modal" id="my_id">
<div class="modal-block">
lorem ipsum... <a href="https://www.instagram.com/user/">instagram</a>
</div>
<div class="modal-footer">
<a id="default-link" class="uk-modal-close" href="javascript:alert('Accept')">Accept and enter</a>
<a class="uk-float-right" href="https://google.com">Deny cookies and leave</a>
</div>
</div>

Answer 2

我现在才找到真正最好的解决方案，因为 window.onload 变慢，当网站加载时，默认链接在当前页面的第一个链接上......

所以最好的html5解决方案，非常简单，这确实使你的任何项目成为默认值，独立于页面或文档加载：

<div autofocus>