如何禁用 HTML 锚元素 onload答案

【问题标题】：How to disable an HTML anchor element onload如何禁用 HTML 锚元素 onload
【发布时间】：2022-05-04 04:09:45
【问题描述】：

我有一个 <a> element，该元素像我想在站点加载上禁用的按钮，并且在选中复选框时， a link将单击。

我在type=button 的输入上完成了此操作，但问题是输入按钮不适用于我的平滑滚动效果。

【问题讨论】：

你能创建一个你在 jsfiddle.net 上的样本吗？
jsfiddle.net/QBWTr 这是我现在所拥有的，在我想将按钮更改为链接标签之前。我还没有在 jquery 代码中包含输入按钮。谢谢
您不能在超链接上使用 disabled 属性。它用于输入元素。

【解决方案1】：

这应该很好用：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

<a id="alink" href="javascript:void(0);">Some Link</a>

<br /><br />

<input id="chkid" type="checkbox" value"" name="somename" />

<script type="text/javascript">
$(document).ready(function(){
$('#chkid').unbind("click").click(function(){
var chkid = this.id;
if($(this).is(':checked')){
$("a#alink").attr('href', 'http://www.google.com');
}else{
$("a#alink").attr('href', 'javascript:void(0);');
}
});
});
</script>

【讨论】：

这确实工作得很好，非常感谢。但是，我想寻求其他帮助，我应该如何或应该在此处列出的 jquery 平滑滚动代码中添加什么 jsfiddle.net/QBWTr 所以启用的链接不会直接跳到它的链接
。其他“a”适用于这种平滑的滚动效果。再次感谢。
那是另一个问题。如果我的解决方案解决了您最初的问题，请标记为答案。您需要发布您的完整代码，其中包括您的 html 以及 jsfiddle 上的 JQuery，以便其他人可以看到您实际尝试做的事情。

【解决方案2】：

CSS：

button.dead {
   background: transparent;
   border: none
}

button.dean a {
   color: #ddd
}

jQuery：

$(function() {

    // toggleWrap() function will call when user change the checkbox
    // wrap -> parameter contain true or false (which is chekcbox status)

    function toggleWrap(wrap) {
        // checking for the condition when checkbox is not checked
        if(!wrap) {
             // wrapping the <a> tag with a button which is 
             // disabled, so it will unclickable
             $('a').wrap($('<button/>', {
                disabled: true,
                'class': 'dead', // this class have some CSS
                 width: $('a').width()  // width of button change to <a> width
            })); 
        } else  {
            // following code will work when checkbox is not checked
            // .unwrap() function will remove the <button> wrapper from <a>
            // and unpack the <a> tag to clickable

            $('a').unwrap();
        }
    }

    $('input:checkbox').on('change', function() {  // bind event to fire when user change the checkbox
        // this.checked hold the checkbox status
        // which is boolean true => if checked or false => if not checked
        toggleWrap(this.checked);
    });
    toggleWrap(false); // this is the initial call to function at page load
});

【讨论】：