Jquery mobile 中在列表項上使用單選按鈕

 

無意中發現可以在li上實現開關按鈕

http://jsfiddle.net/Gajotres/pzfr2/

 

 

 

 

 

 

 

 

觸類旁通，終於實現了在li上增加單選按鈕組

 

1. @model QGateMobile.Areas.WG32.Models.SystemConfigModel
2. @{
3.     ViewBag.Title = "系統配置";
4. }
5. @section Header {
6.     @Html.ActionLink("后退", "Index", "Home", null, new { data_icon = "arrow-l", data_rel = "back" })
7.     <h1>@ViewBag.Title</h1>
8. }
9.  
10. <style type="text/css">
11.     #raido-container {
12.         position: relative;
13.         float: right;
14.         margin-top: -10px !important;
15.     }
16.  
17.         #raido-container .ui-slider {
18.             margin-top: -50px !important;
19.         }
20. </style>
21.  
22.  
23.  
24. <p>
25.     在此完成系統配置
26. </p>
27. <ul data-role="listview" data-inset="true" style="list-style-type: none;">
28.     <li>@Ajax.ActionLink("數據庫更新", "UpdateDB", "Home", new AjaxOptions())</li>
29. </ul>
30. <ul data-role="listview" data-inset="true" style="list-style-type: none;">
31.     <li data-role="list-divider">反潛回設置</li>
32.  
33.     <li data-role="fieldcontain">
34.         <p>
35.             反潛(同一控制器上多門反潛）
36.         </p>
37.         <p>
38.             網段(同網段多控制器共享反潛)
39.         </p>
40.         <p>
41.             區域(同區域多控制器共享反潛)
42.         </p>
43.         @{
44.             string[] ss = new string[4];
45.             if (Model.AntiBack == 0)
46.             {
47.                 ss[0] = "checked=\"checked\"";
48.             }
49.             ss[Model.AntiBackBroadcast] = "checked=\"checked\"";
50.         }
51.         <div data-role="controlgroup" data-type="horizontal">
52.             <input type="radio" name="antiback" id="antibackRadio1" value="0" @Html.Raw(ss[0]) />
53.             <label for="antibackRadio1">禁用</label>
54.             <input type="radio" name="antiback" id="antibackRadio2" value="1" @Html.Raw(ss[1]) />
55.             <label for="antibackRadio2">反潛</label>
56.             <input type="radio" name="antiback" id="antibackRadio3" value="2" @Html.Raw(ss[2]) />
57.             <label for="antibackRadio3">網段</label>
58.             <input type="radio" name="antiback" id="antibackRadio4" value="3" @Html.Raw(ss[3]) />
59.             <label for="antibackRadio4">區域</label>
60.         </div>
61.         @*<input type="checkbox" data-role="flipswitch" name="anti" id="anti" checked="">*@
62.     </li>
63. </ul>
64. @Scripts.Render("~/bundles/anti")