2017-07-08 191 views
-2

我想單擊第一個按鈕,然後激活第二個按鈕。第二個按鈕激活後,第一個按鈕將被禁用。我寫了下面的代碼,但它不起作用。哪裏有問題?單擊一個按鈕,然後激活另一個按鈕

<!DOCTYPE html> 
<html> 
<head> 
<title>Edit Page</title> 
</head> 
<body> 
<input type="submit" name="submit" value="button1" id="bt1"> 
<input type="button" name="button" value="button2" id="bt2" disabled="disabled"> 
</body> 
<script> 
$(function(){ 
     $("#bt1").click(function(){ 
      $(this).attr("disabled", "disabled"); 
      $("#bt2").removeAttr("disabled"); 
     }); 

     $("#bt2").click(function(){ 
      $(this).attr("disabled", "disabled"); 
      $("#bt1").removeAttr("disabled"); 
     }); 
    }); 
</script> 


</html> 
+0

你din't加入jQuery庫file.That撥弄https://jsfiddle.net/vg76h03q/。它的工作完全是這個問題只有 –

+0

在這裏你去 – Shiladitya

+1

我忘記了。感謝您記住我:) – Susant

回答

1

包括jQuery庫文件在頭頂標籤的頂部是這樣的:

<html> 
<head> 
<title>Edit Page</title> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script>$(function(){ 
$("#bt1").click(function(){ 
$(this).attr("disabled", "disabled"); 
$("#bt2").removeAttr("disabled"); 
}); 

$("#bt2").click(function(){ 
$(this).attr("disabled", "disabled"); 
$("#bt1").removeAttr("disabled"); 
}); 
}); 
</script> 
</head> 
<body> 
<input type="submit" name="submit" value="button1" id="bt1"> 
<input type="button" name="button" value="button2" id="bt2" disabled="disabled"> 
</body> 
</html> 
2

你的代碼是完美的,只是添加jQuery庫,它會從這裏開始工作

檢查: -

$(function(){ 
 
    $("#bt1").click(function(){ 
 
    $(this).attr("disabled", "disabled"); 
 
    $("#bt2").removeAttr("disabled"); 
 
    }); 
 

 
    $("#bt2").click(function(){ 
 
    $(this).attr("disabled", "disabled"); 
 
    $("#bt1").removeAttr("disabled"); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <title>Edit Page</title> 
 
    </head> 
 
    <body> 
 
    <input type="submit" name="submit" value="button1" id="bt1"> 
 
    <input type="button" name="button" value="button2" id="bt2" disabled="disabled"> 
 
    </body> 
 
</html>

相關問題