Question

我想点击它后禁用链接按钮＆amp;其他启用。使用javascript

在两个链接按钮之间切换启用/禁用

<a id="a1" href="page1.aspx">One</a><a id="a2" href="page2.aspx">Two</a>

Answer 1

简单，只需在两个链接上的onclick事件中添加侦听器，即禁用相关链接并启用另一个链接。

像

这样的东西

document.getElementById('a1').onclick = function() {
   document.getElementById('a1').disabled = true;
   document.getElementById('a2').disabled = false;
};

document.getElementById('a2').onclick = function() {
   document.getElementById('a2').disabled = true;
   document.getElementById('a1').disabled = false;
};

当然，如果您要将其扩展到多个按钮，那么您可以轻松地将上述内容抽象为注册方法，循环遍历按钮数组等（可能是那些实现特定类而不是显式指定数组的那些））。

Answer 2

最简单的方法是隐藏链接，而不是使其禁用。

点击它后，您可以使用此代码隐藏链接。

其测试代码＆amp;它对我来说很完美。： - ）

<script type="text/javascript">
    onclick = function() {
        var chk= document.getElementById('myElementId');
        chk.style.display="none"; 
    };
</script>

Answer 3

要禁用LINK而不是BUTTON，除了隐藏它之外你唯一能做的就是设置它不要去任何地方。

onclick="this.href='javascript: void(0)';"

Answer 4

您可以像这样访问和设置“禁用”属性：

if(somebutton.disabled == true){
  somebutton.disabled = false;
}

我建议使用像jQuery这样的JavaScript框架。

Answer 5

您的问题可能包含以下3种情况中的任何一种。选择适合您问题的套件。

案例1）你的问题中的一个问题是，因为它们是分别指向page1.aspx和page2.aspx的链接，一旦你点击链接，新的页面就会在浏览器中加载。所以你想要达到的效果并不重要。

案例2）如果您在每个aspx页面上都有“One”和“Two”链接，那么您也可以硬编码指向自身的链接的禁用。（或者根本没有链接）。

案例3）如果您有一个框架来显示链接“一个”，“两个”，并且您有另一个框架来加载两个链接的内容，那么您的问题具有禁用另一个链接的含义。这是相同的代码。

 <html>
<a id="a1" href="javascript:void(0)" onclick="toggle(objA1,objA2,'page1.aspx')">One</a>
<a id="a2" href="javascript:void(0)"  onclick="toggle(objA2,objA1,'page2.aspx')">Two</a>
<br><iframe id="ifrm" src=""></iframe>

<script>
    var objA1 = document.getElementById('a1');
    var objA2 = document.getElementById('a2');

    // d=element to disable, e=element to enable 
    function toggle(d,e,link)
    {
        //if already disabled do nothing(don't follow url)
        if(d.disabled) return; 

        //enable/disable
        d.disabled = true;
        d.style.cursor = 'default';
        e.disabled = false;
        e.style.cursor = 'hand';

        //follow link
        ifrm.src = link;
    }
</script>
</html>

Answer 6

<html>
<head>

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>

<style type="text/css">
    .submit{
        padding:8px;
        border:1px solid blue;
    }
</style>

</head>

<body>

<h1>Disabled submit form button after clicked with jQuery</h1>

<form action="#">
    <p>
        I'm a form ~
    </p>
    <input type="submit" value="Submit"></input>
        <button>Enable Submit Button</button>
</form>

<script type="text/javascript">

$('input:submit').click(function(){
    $('p').text("Form submiting.....").addClass('submit');
    $('input:submit').attr("disabled", true);   
});

$('button').click(function(){
    $('p').text("I'm a form ~").removeClass('submit');
    $('input:submit').attr("disabled", false);  
});

</script>

</body>
</html>

Answer 7

<script type="text/javascript">  
    function validateForm(formObj) {
        if (formObj.username.value=='') {  
            alert('Please enter a username');  
            return false;  
        }
        formObj.submitButton.disabled = true;  
        formObj.submitButton.value = 'Please Wait...';  
        return true;  
    }
</script>
<form name="frmTest" action="" method="post" onsubmit="return validateForm(this);">  
    Username: <input type="text" name="username" value="" /><br />  
    <input type="submit" name="submitButton" value="Submit" />  
</form>

我想在点击它和其他启用后禁用链接按钮。使用javascript在两个链接按钮之间切换启用/禁用

7 个答案: