easyUI 設置文本框是否可編輯

需求說明:在文本框之後增加一個複選框,勾選則可以編輯,不勾選則無法編輯。
方法說明:

  1. 獲取當前控件屬性值
    var state = $(‘#id).textbox(‘options’).readonly;
    此處的textbox可爲easyUI其他控件^_^
  2. 改變文本框是否可編輯
    $(‘#id).textbox(‘readonly’,false);//設置文本框可編輯

    $(‘#id).textbox(‘readonly’,true);//設置文本框不可編輯

  3. 改變文本顏色
    $(“.wblj_kp .textbox .textbox-text”).css(‘color’,’#ccc’);//灰色

    $(“.wblj_kp .textbox .textbox-text”).css(‘color’,’#555a66’);//黑色
    具體代碼:
    js代碼:

$(document).ready(function(){
                $('#articlesRedirecturl').textbox('readonly',true);
                $(".wblj_kp .textbox .textbox-text").css('color','#ccc');/* #555a66 */
`});``

`function show(){
                var state = $('#articlesRedirecturl').textbox('options').readonly;
                if(state==true){
                    $('#articlesRedirecturl').textbox('readonly',false);
                    $(".wblj_kp .textbox .textbox-text").css('color','#555a66');
                }else if(state==false){
                    $('#articlesRedirecturl').textbox('readonly',true);
                    $(".wblj_kp .textbox .textbox-text").css('color','#ccc');
                }
            }`

html代碼:
                <div class="kRight">
                    <div class="w254">
                        <input class="easyui-textbox" id="articlesRedirecturl" name="model.articlesRedirecturl" type="text" value="${model.articlesRedirecturl}">
                    </div>
                    <div class="kRight_r lh34">
                        <input type="checkbox" name="likeBoolean" onchange="show();"><span class="marginl10">勾選後稿件可查看外部鏈接</span>
                    </div>
                 </div>
            </div>

“`

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章