<html> <head> <mce:script type="text/javascript" src="script/jquery.js" mce_src="script/jquery.js"></mce:script> <mce:script type="text/javascript"><!-- function showinfo() { //通过jquery查询下拉框中的内容 var value = $("#slt1").val(); //alert(value); var text = $("#slt1 option:selected").text(); //alert(text); //通过普通的方法选择下拉框中的内容 var selectedInfo = document.getElementById("slt1").options[document.getElementById("slt1").selectedIndex]; //alert(selectedInfo.value); //alert(selectedInfo.text); } $(function(){ $("#slt1").change(function(){ //选出所有的option var all=$("#slt1 option"); //alert(all.length); //对option循环,将字体全部置为黑色 all.each(function(){ $(this).css("color","black"); }); //将选中的置为红色 var selected = $("#slt1 option:selected"); selected.css("color","red"); }); }); // --></mce:script> </head> <body> <select id="slt1"> <option value="1">aaa</option> <option value="2">bbb</option> <option value="3">ccc</option> <option value="4">ddd</option> </select> <button οnclick="showinfo();" value="showinfo">showinfo</button> </body> </html> 具体见注释!