BloggerADS

2013年3月28日 星期四

jQuery Mobile - 在 listview 使用 radio button 和 data-split-icon


功能介紹
使用jQuery Mobile 在Listview內使用分隔欄(data-split-icon) 和 radio
效果圖

程式碼

<div data-role="page" id="home">

    <div data-role="content">

        <ul data-role="listview" data-inset="true" style="margin:0;">

            <li  data-role="list-divider">List</li>

            <li style="padding:0;border:0;">

                <div data-role="fieldcontain" style="margin:0;padding:0;">

                    <ul id="step1" data-role="listview" data-inset="true" data-split-icon="arrow-r" style="margin:0;">
                      <li> <a href="#" style="padding:0;border:0;">
               <label for="1" style="margin:0;border:0;">

                    <div style="float:left;width:60%">test1</div>
               </label>
               <input type="radio" id="1" name="test" value="test1">

                </a>

 <a href="http://bileong.blogspot.tw/"></a>


                      </li>
                       <li> <a href="#" style="padding:0;border:0;">
               <label for="2" style="margin:0;border:0;">

                    <div style="float:left;width:60%">test2</div>
              </label>
              <input type="radio" id="2" name="test" value="test2">
               </a>

 <a href="http://bileong.blogspot.tw/"></a>


                       </li>

                    </ul>

                </div>

            </li>

        </ul>

    </div>

</div>

沒有留言:

張貼留言