js 自定义个性下拉选择框示例_javascript技巧

<script src="../<a%20style=" color: text-decoration:underline title="js" href="https://www.php.cn/zt/15802.html" target="_blank">js/jquery.js"></script>














<script type="text/javascript"> <BR>$(".droparrow").click(function(e){ <BR>var quest = $(this).parent(); <BR>var questwidth = parseInt(quest.width()); <BR>var questheight = quest.height(); <BR>var left = quest.offset().left; <BR>var top = parseInt(quest.offset().top)+parseInt(questheight)+4; <BR>var attrs = quest.attr("quest"); <BR>var selectsd = $('.chooseItems[answer='+attrs+']'); <BR>var selectsdHeight = selectsd.height(); <BR>if((top+selectsdHeight)>$(window).height()){ <BR>top = top - selectsdHeight - questheight-7; <BR>} <BR>if($(selectsd).is(":visible")){ <BR>$(selectsd).hide(); <BR>}else{ <BR>$(selectsd).css({"left":left+"px","top":top+"px","width":questwidth+"px"}).show(); <BR>} <BR>}); <BR>$(".dropdiv").click(function(e){ <BR>var quest = $(this).parent(); <BR>var questwidth = parseInt(quest.width()); <BR>var questheight = quest.height(); <BR>var left = quest.offset().left; <BR>var top = parseInt(quest.offset().top)+parseInt(questheight)+4; <BR>var attrs = quest.attr("quest"); <BR>var selectsd = $('.chooseItems[answer='+attrs+']'); <BR>var selectsdHeight = selectsd.height(); <BR>if((top+selectsdHeight)>$(window).height()){ <BR>top = top - selectsdHeight - questheight-7; <BR>} <BR>if($(selectsd).is(":visible")){ <BR>$(selectsd).hide(); <BR>}else{ <BR>$(selectsd).css({"left":left+"px","top":top+"px","width":questwidth+"px"}).show(); <BR>} <BR>}); <BR>$(".chooseItem").click(function(e){ <BR>var divhtml = $(this); <BR>var displayMember,valueMember; <BR>displayMember = divhtml.attr("displayMember"); <BR>valueMember = divhtml.attr("valueMember"); <BR>var attrs =$(this).parent().attr("answer"); <BR>var parent = $("#"+attrs); <BR>var olddisplayMember,oldvalueMember; <BR>olddisplayMember = parent.attr("displayMember"); <BR>oldvalueMember = parent.attr("valueMember"); <BR>if(olddisplayMember !=displayMember){ <BR>parent.attr("displayMember",displayMember); <BR>parent.attr("valueMember",valueMember); <BR>parent.html(valueMember); <BR>parent.change(); <BR>} <br><br>$(this).parent().hide(); <BR>}); <BR>$(".dropdiv").change(function(e){ <BR>alert($(this).attr("valueMember")); <BR>}); <BR>$(".dropmiandiv").mouseleave(function(e){ <BR>var quest = $(this).attr("quest"); <BR>$('.chooseItems[answer='+quest+']').hide(); <BR>}); <BR>$(".chooseItems").mouseenter(function(e){ <BR>$(this).show(); <BR>}); <BR>$(".chooseItems").mouseleave(function(e){ <BR>$(this).hide(); <BR>}); <BR></script>