HTML下拉列表的语句,jquery-div模拟下拉列表框(Select)插件

$.fn.SimulateSelect = function(data, f) {

var inOb = $(this);

var currentid = $(this).attr("id");

var id = 'divSelect' + currentid;

var width = $(this).width();

$(this).hide();

$(this).parent().append('

$('#a_' + id).addClass("dropselectbox dropdown").css({

'width': width - 10

}).html('').html($(this).val());

$('#a_' + id).click(function(eb) {

$('#b_' + id).show();

try {

eb.stopPropagation();

}

catch (e) {

event.cancelBubble = true;

}

});

var changeleft = false;

// 这里只针对IE8,其他浏览器无此问题

if ($.browser.msie)

changeleft = ($.browser.version) >= 8;

if (changeleft) {

$('#b_' + id).addClass("ullist").css({

'width': width + 9,

'top': $('#a_' + id).offset().top + 34

}).hide();

} else {

$('#b_' + id).addClass("ullist").css({

'width': width + 9,

'top': $('#a_' + id).offset().top + 34,

'left': $('#a_' + id).offset().left

}).hide();

}

$('

var _count = 0;

$.each(eval("("+data.value+")"), function(o, ov) {

_count++;

$("

").html(ov).attr('v', ov).click(function(eb) {

$(inOb).val($(this).attr('v'));

$('#a_' + id).html('').html($(this).html());

$("#" + currentid).val($(this).html());

$('#b_' + id).hide();

if (f)

f($(this).attr('v'), $(this).html());

try {

eb.stopPropagation();

}

catch (e) {

event.cancelBubble = true;

}

}).hover(function() {

/*$('#b_' + id).find('li[class=floatred]').removeClass('floatred'); */

$(this).addClass('floatred');

/*$('#b_' + id).find('li').removeClass("over"); */

$(this).addClass("over");

}, function() {

$(this).removeClass('floatred');

$(this).removeClass("over");

}).click(function(){

$(this).addClass("selectedli");

/* 跳转 */

....这里可以加入选中后页面跳转的动作

}).appendTo($('#b_' + id + ' ul'));

});

// 绑定初始值

if (data.select != "") {

$('#a_' + id).html('').html(data.select);

$("#" + currentid).val(data.select);

}

if (_count > 10 ) {

$('#b_' + id).find("ul").css("height", "500px");

}

var liobj = $('#b_' + id).find('li[v=' + inOb.val() + ']');

if (liobj.html()) {

liobj.addClass('floatred');

$('#a_' + id).html(liobj.html());

}

else {

inOb.val('');

}

$(document).click(function() {

$("#b_" + id).hide();

});

};