我正在构建一个带有特殊渲染菜单的JQuery autocomplete
,一切正常。但我有悬停问题并专注于autocomplete
项目,悬停在谷歌浏览器中可以正常工作,但它不在IE浏览器中。焦点在IE或谷歌浏览器中都不起作用。
这是我的CSS:
.ui-autocomplete
{
position: absolute;
width: 400px;
height:150px;
background-color:<%=Session("COR")%>;
border: 2px solid #658DF2;
overflow-y:scroll;
overflow-x:hidden;
}
.ui-menu-item table tr:hover td {
background-color: #FEF693;
}
这是我的自动完成渲染菜单:
$(function() {
$.ui.autocomplete.prototype._renderMenu = function(ul, items) {
var self = this;
ul.append("<table width=100% class='clsStd'><thead><tr><th width=15%>ID</th><th>Name</th></tr></thead><tbody></tbody></table>");
$.each( items, function( index, item ) {
self._renderItemData(ul, item );
});
};
$.ui.autocomplete.prototype._renderItemData = function(ul, item) {
return this._renderItem(ul, item ).data( "ui-autocomplete-item", item );
};
$.ui.autocomplete.prototype._renderItem = function(ul, item) {
return $("<li class='ui-menu-item'></li>")
.append( "<table width=100% class='clsStd' border='0' style='cursor:pointer;padding:0;'><tr><td width='15%'><a>"+item.value+"</a></td>"+"<td width='85%'><a>"+item.label+"</a></td></tr></table>" )
.appendTo( ul );
};
});
我试过这个:“.ui-menu-item table tr:hover td, .ui-menu-item table tr:focus td
”但它看起来不太好!!
任何建议都非常感谢!!