EasyUI系列學習(七)-Linkbutton(按鈕)


一、加載組件

1.使用class加載

<a href="#" class="easyui-linkbutton">按鈕</a>

2.使用js加載

<a href="#" id="btn"></a>
<script>
    $(function () {
        $("#btn").linkbutton({
            text: "按鈕"
        });
    })
</script>

二、屬性

1.id,disabled,text,iconCls,iconAlign,plain

<a href="#" id="btn"></a>
<script>
    $(function () {
        $("#btn").linkbutton({
            //默認為null
          id: "pox",
            //為true時禁用按鈕
            disabled: true,
            //按鈕文字
            text: "按鈕",
            //按鈕圖標,css類的id
           iconCls: "icon-add",
            //圖標在文字的右側(left,right)
            iconAlign: "right",
            //為true時,顯示簡潔效果
            plain: true
        });
    })
</script>

生成的html

<a id="pox" class="l-btn l-btn-small l-btn-plain l-btn-disabled l-btn-plain-disabled" href="javascript:void(0)" group="">
    <span class="l-btn-left l-btn-icon-right">
        <span class="l-btn-text">按鈕</span>
        <span class="l-btn-icon icon-add"> </span>
    </span>
</a>

2.toggle:設置true則運行用戶切換氣狀態是否被選中,可實現checkbox復選功能效果,默認為false

<a href="#" id="btn1">C#</a>
<a href="#" id="btn2">Java</a>
<script>
    $(function () {
        $("#btn1").linkbutton({
            toggle: true
        });
        $("#btn2").linkbutton({
            toggle: true
        });
    })
</script>

3.group:指定相同組名的按鈕同屬於一個組,可實現radio單選效果

<a href="#" id="btn1"></a>
<a href="#" id="btn2"></a>
<script>
    $(function () {
        $("#btn1").linkbutton({
            toggle: true,
            group: "sex"
        });
        $("#btn2").linkbutton({
            toggle: true,
            group: "sex"
        });
    })
</script>

4.selected:定義按鈕的選中狀態

三、方法

1.options:

<a href="#" id="btn"></a>
<script>
    $(function () {
        $("#btn").linkbutton({
           
        });
        console.log($("#btn").linkbutton("options"));
    })
</script>

輸出的內容如下

image

2.disable

3.enable

四、設置默認值

$.fn.linkbutton.defaults.plain = true;


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM