这是一个很简单的功能,jquery实现下拉框选中对应的div。
虽然简单但是会在项目之中经常会用到,尤其是统计的时候,按照不同类型或者不同的年月日来选择相对应的内容。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jquery实现下拉框选中对应的div</title> <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script> </head> <body> <select onchange="cl(this)"> <option value="1" > 1</option> <option value="2"> 2</option> <option value="3"> 3</option> <option value="4" > 4</option> <option value="5" > 5</option> </select> <div> <div id="div1">111</div> <div id="div2" style="display:none;">222</div> <div id="div3" style="display:none;">333</div> <div id="div4" style="display:none;">44444</div> <div id="div5" style="display:none;">55555555</div> </div> <script> function cl(obj){ $(obj).next("div").find("div").each(function(){ $(this).hide(); }); $("#div" + obj.value).show(); } </script> </body> </html>