写了一个可以个性化设置的仿<select>标签
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="jquery.js"> </script> <style> .select{ width: 100px; height: 20px; position: relative; margin-top: 20px; } .select_show{ width: inherit; height: inherit; border: 1px solid gray; } .select_option{ width: inherit; height: inherit; border: 1px solid gray; border-top: 0; } .select_option_container{ width: inherit; display: none; position: absolute; z-index: 999; } </style> </head> <body> <div class="select"> <div class="select_show">222</div> <div class="select_option_container"> <div class="select_option">111</div> <div class="select_option">222</div> <div class="select_option">333</div> </div> </div> <div class="select"> <div class="select_show">222</div> <div class="select_option_container"> <div class="select_option">111</div> <div class="select_option">222</div> <div class="select_option">333</div> </div> </div> <div class="select"> <div class="select_show">222</div> <div class="select_option_container"> <div class="select_option">111</div> <div class="select_option">222</div> <div class="select_option">333</div> </div> </div> <div class="select"> <div class="select_show">222</div> <div class="select_option_container"> <div class="select_option">111</div> <div class="select_option">222</div> <div class="select_option">333</div> </div> </div> <div class="select"> <div class="select_show">222</div> <div class="select_option_container"> <div class="select_option">111</div> <div class="select_option">222</div> <div class="select_option">333</div> </div> </div> <script> $(".select_show").click(function(){ var optionContainerLeft=0; var optionContainerTop=$(this).outerHeight(); $(this).closest(".select").find(".select_option_container").css("left",optionContainerLeft).css("top",optionContainerTop).show(); }) $(".select_option").click(function(){ $(this).closest(".select_option_container").hide(); $(this).closest(".select").find(".select_show").html($(this).html()); }) </script> </body> </html>
请爱好前端技术的朋友,联系我,有问题大家一起讨论