按鈕背景爲圖片，在按鈕不可用時，將按鈕置灰

這個需求有兩種解決方法，一種是通過濾鏡來實現，還有一種簡單除暴，直接在按鈕不可用時，將按鈕背景圖片換成灰色的背景

1.按鈕添加灰色濾鏡

.btn-disabled {
   filter: grayscale(100%); 
   -webkit-filter: grayscale(100%); 
   -moz-filter: grayscale(100%);
   -ms-filter: grayscale(100%);
   -o-filter: grayscale(100%);
   filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
    opcacity:0.5;
}

但是這種方式在IE11及以下版本的瀏覽器內不會生效，因爲我做的是移動端項目，因此不會有這個問題

2.背景圖片採用灰色背景

/*正常時背景樣式*/
.debit-btn {
 background: url("../../assets/images/debit_btn.png") no-repeat;
 background-position: center center;
 background-size: 100% 100%;
}


/*不可用時背景樣式*/
.debit-btn-disabled {
 background: url("../../assets/images/debit_btn_disabled.png") no-repeat;
 background-position: center center;
 background-size: 100% 100%;
}

然後在按鈕上根據狀態值動態設置樣式