bug描述:
当鼠标点击输入框后,输入“a”,提示框自动弹出,此时点击右侧空白处,也就触发了输入框的onblur事件,此时提示列表会隐藏。此时再次点击输入框,提示框又弹出,这时再点击右侧空白处代码后,提示框不再消失!由于不能传附件,我只好把所有文件都贴上来demo.html<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN'><html>
<head>
<title>InputPrompt</title>
<meta http-equiv="content-type" content="text/html; charset=GBK">
<link rel="stylesheet" type="text/css" href="inputPrompt.css" />
<script type="text/javascript" src="sg.js"></script>
<script type="text/javascript">
<!--
var index = 0;
var data = new Array();
data[index++] = '1sdfsdf';
data[index++] = 'a11sdafs.net';
data[index++] = 'b22dsafsdf';
data[index++] = 'c333asdfsadf';
data[index++] = '4444dsafasdf';
data[index++] = 'dddsfddsafdsaf';
data[index++] = '121213dsafsdaf';
data[index++] = '43213asdfadsf';
data[index++] = 'dsa3121dasf3';
data[index++] = 'a213';
data[index++] = '323313';
data[index++] = '3213';
data[index++] = '32213';
data[index++] = 'dsfsdddd';
data[index++] = 'ds11dfsfd';
data[index++] = 'ffdafd';
data[index++] = 'afdfd';
data[index++] = 'afd';
data[index++] = 'baffad';
data[index++] = '2fda2fd';
data[index++] = 'dasd';

function test() {
inputPrompt('testInput', data);
}
//-->
</script>
</head>
<body>
<input id="testInput" value="" onclick="test()" />
</body>
</html>inputPrompt.cssdiv.promptList {
position: absolute;
border-right: 1px solid #7F7F7F;
border-bottom: 1px solid #7F7F7F;
border-left: 1px solid #7F7F7F;
font-size: 14px;
cursor: default;
}div.selectedItem {
background-color: #E3EAFD;
color: #2D2D2D;
}div.unSelectedItem {
background-color: #FFFFFF;
color: #2D2D2D;
}sg.jsfunction inputPrompt(inputId, dataArray) {

if (dataArray.constructor != Array) {
return;
}

dataArray.sort(function(a, b) {
if (a.length > b.length)
return 1;
else if (a.length == b.length)
return a.localeCompare(b);
else
return -1;
});

var promptList = document.createElement('div');
document.body.appendChild(promptList);
promptList.id = 'promptList';
promptList.className = 'promptList';
promptList.style.display = 'none';

var $input = document.getElementById(inputId);
var selectedIndex = -1;
var currentIndex;

if (!$input) {
return;
}

$input.onblur = hidePrompt;
$input.onkeyup = checkKeyCode;
$input.onfocus = checkAndShow;

function showPrompt() {
if (promptList)
promptList.style.display = 'block';
}

function hidePrompt() {
if (promptList) {
promptList.style.display = 'none';
alert('hide');
}
}

function isHidePrompt() {
if (promptList)
return promptList.style.display == 'none';
else
return true;
}

function checkKeyCode() {
var ie = (document.all) ? true : false;
if (ie) {
var keyCode = event.keyCode;
if (keyCode == 40 || keyCode == 38) { // down or up
var isUp = true;
if (keyCode == 40) // down
isUp = false;
changeSelection(isUp);
} else if (keyCode == 13 ) { // Enter
outSelection(selectedIndex);
} else {
checkAndShow();
}
} else {
checkAndShow();
}
divPosition();
} function checkAndShow() {
var inputVal = $input.value;
if (inputVal != '') {
divPosition();
selectedIndex = -1;
promptList.innerHTML = '';
for (currentIndex = 0; currentIndex < dataArray.length; currentIndex++) {
for (var i = 0; i < dataArray[currentIndex].length; i++) {
if (dataArray[currentIndex].substr(i, inputVal.length).toUpperCase() == inputVal.toUpperCase()) {
addOption(dataArray[currentIndex], inputVal);
}
}
}
showPrompt();
} else {
hidePrompt();
}

function addOption(value, keywords) {
var v = value.replace(keywords, '<b><font color="red">' + keywords + '</font></b>');
promptList.innerHTML += "<div onmouseover=\"this.className='selectedItem'\" onmouseout=\"this.className='unSelectedItem'\" onmousedown=\"document.getElementById('"
 + inputId + "').value='" + value + "'\">"
 + v
 + "</div>";
}
}

function changeSelection(isUp) {
if (isHidePrompt()) {
showPrompt();
} else {
if (isUp)
selectedIndex--;
else
selectedIndex++;
}
var maxIndex = promptList.children.length - 1;
if (selectedIndex < 0) {
selectedIndex = 0;
}
if (selectedIndex > maxIndex) {
selectedIndex = maxIndex;
}
for (currentIndex = 0; currentIndex <= maxIndex; currentIndex++) {
if (currentIndex == selectedIndex) {
promptList.children[currentIndex].className = 'selectedItem';
} else {
promptList.children[currentIndex].className = 'unSelectedItem';
}
}
}

function outSelection(index) {
if (promptList.children.length > 0 && promptList.children[index]) {
$input.value = promptList.children[index].innerText;
hidePrompt();
}
}

function divPosition() {
promptList.style.top = getAbsoluteHeight($input) + getAbsoluteTop($input);
promptList.style.left = getAbsoluteLeft($input);
promptList.style.width = getAbsoluteWidth($input);
} function getAbsoluteHeight(o) {
return o.offsetHeight;
}

function getAbsoluteWidth(o) {
return o.offsetWidth;
}

function getAbsoluteLeft(o) {
var s_el = 0;
el = o;
while (el) {
s_el = s_el + el.offsetLeft;
el = el.offsetParent;
}
return s_el;
}

function getAbsoluteTop(o) {
var s_el = 0;
el = o;
while (el) {
s_el = s_el + el.offsetTop;
el = el.offsetParent;
}
return s_el;
}
}
高手们来吧!100分太少了我觉得!