按鈕切換顯示不同的內容(js控制)

今天項目發現了一個jsp頁面按鈕切換，下面展示模塊的不同顯示問題，看到同事修改完之后的效果，js控制感覺特寫好，所以想寫把這個好的方法js記錄下來，以便以后的參考。

一：先上圖，了解大概的樣子，如下圖

點擊是的時候，下面塊中的內容顯示出來，同時框中的值設置為默認的值，不讓自己選擇輸入；點擊否的時候，下面的內容消失。

二、下面展示js控制的部分：

   /**
    * 產品后續交易（是否可轉讓）處理
    */
   //是否可轉讓
   var isInvestTransferable = eval("${product.isInvestTransferable }");//獲取切換按鈕的值，作為后續數據顯示的判斷標准。，
   var InvestTransferDiv = {//對顯示模塊部分做相應的控制
       addValid:function(){ //是的時候，給下面的模塊添加校驗
           $("#creditAgreementType").rules("add", {required: true});
           $("#investTransferDayLimit").rules("add", {required: true, digits:true, maxlength:5 });
           $("#investTransferDayLimitEnd").rules("add", {required: true, digits:true, maxlength:5 });
           $("#investTransferFeeRate").rules("add", {required: true, number:true, isDecimal:[0, 10, 2] });
       },
   removeValid:function(){ //否的時候，給下面的模塊移除校驗
           $("#creditAgreementType").rules("remove");
           $("#investTransferDayLimit").rules("remove");
           $("#investTransferDayLimitEnd").rules("remove");
 $("#investTransferFeeRate").rules("remove");

 },
 show:function(){//顯示的時候，增添校驗，賦值
 this.addValid();
 $("#investTransferDayLimit").val("1").attr("readOnly",true);
 $("#investTransferDayLimitEnd").val("1").attr("readOnly",true);
 $("#investTransferFeeRate").val("0.5").attr("readOnly",true);
 $("#investTransferDiv").show();
 },
 hide:function(){//隱藏的時候，去掉校驗，將值置為空
 this.removeValid();
 $("#investTransferDayLimit").val("").attr("readOnly",false);
 $("#investTransferDayLimitEnd").val("").attr("readOnly",false);
 $("#investTransferFeeRate").val("").attr("readOnly",false);
 $("#investTransferDiv").hide();
 }
};
//可轉讓，根據獲取值的結果true或者false進行顯示與否。
if(isInvestTransferable) {
 InvestTransferDiv.show();
}

//產品后續交易（是否可轉讓），單選按鈕change事件
$("input[name='isInvestTransferable']").bind("change", function() {
 var isTrue = eval($("input[name='isInvestTransferable']:checked").val());//根據按鈕的onchange事件進行不同的顯示。
 if(isTrue) {
 InvestTransferDiv.show();
 } else {
 InvestTransferDiv.hide();
 }
});

 到此，控制標簽切換展示不同效果的js就完了，發現這段代碼沒有冗余，很好。大家有更好的或者有問題的歡迎大家積極指正啊，謝謝。