<html>
<head>
<script type="text/javascript">
function change()
{
var btn = document.getElementById("btn");
btn.value="已關註";
btn.disabled=true;
}
</script>
</head>
<body>
<input type="button" id="btn" value="關註" onclick="change()"/>
</body>
</html>
點擊那個“關註”button，變成“已關註”
<html>
<head>
<style type="text/css">
.btn
{
width:500px;
height:400px;
}
.btn1
{
background: #ffffff url(1.png) no-repeat;
}
.btn2
{
background: #ffffff url(2.png) no-repeat;
}
</style>
<script type="text/javascript">
function change()
{
var btn = document.getElementById("btn");
btn.className="btn btn2";
btn.disabled=true;
}
</script>
</head>
<body>
<input type="button" id="btn" value="關註" onclick="change()" class="btn btn1"/>
</body>
</html>
在.btn中調整寬高為圖片大小，html文件和圖片在同壹目錄下，1.png和2.png是切換的2張圖片