1. 程式人生 > >jqueryweui關於switch css與js結合

jqueryweui關於switch css與js結合

brush 文字 voice pan fin -c jquery type jquer

        <!--是否需要發票-->
        <div class="invoice clear">
          <div class="weui-cell__bd">發票:</div>
          <div class="weui-cell__ft">
            <label for="switchCP2" class="weui-switch-cp">
              <input id="switchCP2" @click="chooseInv()" value="off" class="weui-switch-cp__input" type="checkbox">
              <div class="weui-switch-cp__box"></div>
            </label>
            <span v-if="!ifinvoice" >不需要</span>
            <span v-if="ifinvoice">需要</span>
          </div>
        </div>

  

    // 選擇是否需要發票
    chooseInv(){
      console.log(‘chooseAbc‘)
      if($(‘#switchCP2‘).val()==‘off‘){
        $(‘#switchCP2‘).val(‘on‘)
        this.ifinvoice = true;
      }else{
        $(‘#switchCP2‘).val(‘off‘)
        this.ifinvoice = false;
      }
    },

  主要是input 的輸入上綁定一個value="off".用點擊事件來控制其值為off或on。然後控制其顏色 和文字

jqueryweui關於switch css與js結合