<span class="STYLE2">radio:</span><br> 第一組：<br> <input type="radio" class="myRadio" value="1" id="myRadio" name="radio" data-color="green"/> <input type="radio" class="myRadio" value="2" id="myRadio" name="radio" data-color="red"/> <br>第二組：<br> <input type="radio" class="myRadio" value="1" id="myRadio2" name="radio2" data-color="green"/> <input type="radio" class="myRadio" value="2" id="myRadio2" name="radio2" data-color="red"/> <script> $().ready(function(){ $('input.myClass').prettyCheckable({ color: 'red' }); $('input.myRadio').prettyCheckable({ color: 'red' }); }); </script> <br><br><br> <span class="STYLE3">三、select（select2） </span><br> <span class="STYLE2">js:</span><br> jquery-2.0.3.min.js<br> select2.js<br> <span class="STYLE2">css:</span><br> select2.css<br> <br> <br> <span class="STYLE2">select2多選下拉： </span><br> <select class="multipleSelect" multiple style="width:300px"> <option value="1">Mustard</option> <option value="2">Ketchup</option> <option value="3">Relish</option> </select> <br> <br> <select class="multipleSelect" multiple style="width:300px"> <option value="1">Mustard2</option> <option value="2">Ketchup2</option> <option value="3">Relish2</option> </select> <br> <script type="text/javascript"> $('select.multipleSelect').select2(); </script> <br> <br> <span class="STYLE2">select2單選下拉： </span><br> <select id="e1" style="width:300px" class="mySingleSelect"> <option ></option> <optgroup label="第一組"> <option value="1">11111111111111</option> <option value="2">22222222222222</option> </optgroup> <optgroup label="第二組"> <option value="3">33333333333333</option> <option value="4">44444444444444</option> </optgroup> <select> <br><br> <select id="e1" style="width:300px" class="mySingleSelect"> <option ></option> <optgroup label="第三組"> <option value="1">55555555555555</option> <option value="2">66666666666666</option> </optgroup> <optgroup label="第四組"> <option value="3">77777777777777</option> <option value="4">88888888888888</option> </optgroup> <select> <script> $(document).ready(function() { $("select.mySingleSelect").select2({ placeholder: "Select a State", allowClear: true }); }); </script> <br> <br> </body> </html> |