2017-07-08 187 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>

相关问题