1. In JQuery Mobile, set the data-role attribute value of the <select> element to slider, you can change the two <option> option styles under the drop-down list element to a flip switch. 2. Sample Code: <HTML> <HEAD> <TITLE> New Document </TITLE> <meta name = "viewport" content = "width = device-width, initial-scale = 1 "/> <link href =" Css/jquery.mobile-1.2.0.min.css "rel =" Stylesheet "type =" text/css "/> <script src =" Js/jquery-1.8.3.min.js" type "text/javascript"> </script> <script src = "Js/jquery. mobile-1.2.0.min.js "type =" text/javascript "> </script> <style type =" text/css "> # pTip {font-weight: bold; clear: both; text-align: center }</style> <script type = "text/javascript"> // display the current value of the flip switch function ChangeEvent () {$ ("# pTip" ).html ($ ("# slider "). val ());} </script> </HEAD> <BODY> <div data-role = "page"> <div data-role = "header">