效果图: 
代码如下:
自定义设置的程度更高可以满足大部分中小型企业的建站需求,同时修正了上一版中发现的BUG,优化了核心的代码占用的服务器资源更少,执行速度比上一版更快 主要的特色功能如下: 1)特色的菜单设置功能,菜单设置分为顶部菜单和底部菜单,每一项都可以进行更名、选择是否隐 藏,排序等。 2)增加企业基本信息设置功能,输入的企业信息可以在网页底部的醒目位置看到。 3)增加了在线编辑功能,输入产品信息,企业介绍等栏
<script type="text/javascript" src="Js/jquery-1.4.2.min.js"></script>
<script type="text/javascript"> <br>var inputID = "input1"; <br>var selectID = "select1"; <br>var widt = 0; <br>var inputWi = 0; <br>var he = 0; <br>$(function() { <br>inputID = "input1"; <br>selectID = "select1"; <br>widt = 200; <br>inputWi = widt - 20; <br>he = $("#user").height() - 41; <br>var offset = $("input[id=input1]").offset(); <br>$("#" + selectID).change(function() { <br>var newvar = $("#" + selectID).find("option:selected").text(); <br>$("#" + inputID).val(newvar); <br>}).click(function() { <br>$("#select_div_on_key" + selectID).remove(); <br>}).css({ "display": "block", "width": widt + "px", "z-index": 1, "clip": "rect(0px " + widt + "px 51px 151px)" }); <br>$("#" + inputID).keyup(function() { <br>ShowSelectCombo(); <br>}).click(function() { <br>ShowSelectCombo(); <br>}).css({ "z-index": 2, "width": inputWi + "px" }); ; <br>}); <br>function ShowSelectCombo() { <br>var pob = $("#" + inputID); <br>var v = pob.val(); <br>var off = pob.offset(); <br>var wi = pob.width() + 16; <br>var tp = off.top + pob.height() - 100 + 7; <br>var lef = off.left - 200 + 2; <br>var html = "<div class='select_div_list' id='select_div_on_key" + selectID + "' style='width:" + wi + "px;top:" + tp + "px;left:" + lef + "px;'><ul class='select_div_list_ul'>"; <br>$("#" + selectID).find("option").each(function() { <br>var tk = $(this); <br>html += "<li val='" + tk.val() + "' ht='" + encodeURIComponent(tk.html()) + "'>" + tk.html().replace(v, "<span class='selectSPAN'>" + v + "") + ""; <br>}); <br>html += "</script>
var ulDIV = $("#select_div_on_key" + selectID);
ulDIV.remove();
$("#user").append(html);
var ulDIV = $("#select_div_on_key" + selectID);
var hei = ulDIV.find("ul").height();
var newHeight = hei > he ? he : hei;
ulDIV.css({ height: newHeight + "px" });
ulDIV.find("li").hover(function() {
$(this).css({ "background-color": "#316ac5" });
}, function() {
$(this).css({ "background-color": "white" });
});
ulDIV.find("li").click(function() {
var ki = $(this);
var va = ki.attr("val");
var htm = ki.attr("ht");
htm = decodeURIComponent(htm);
$("#" + inputID).val(htm);
$("#" + selectID).val(va);
ulDIV.remove();
});
}









