<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
#dropdown{
list-style: none;
position:absolute;
background:#ffffaa;
cursor: default;
margin: -20px 0px 0px 229px;
padding: 2px 0px 2px 0px;
width:155px
}
#dropdown li{
padding: 3px 3px 3px 3px;
}
#dropdown li:hover{
color:#fff;
padding: 3px 3px 3px 3px;
background:#0000FF;
}
.block-search-result{
border: 3px #CCCCCC solid; /* стили рамки */
-moz-border-radius: 10px; /* закругление для старых Mozilla Firefox */
-webkit-border-radius: 10px; /* закругление для старых Chrome и Safari */
-khtml-border-radius:10px; /* закругл. для браузера Konquerer системы Linux */
border-radius: 10px; /* закругление углов для всех, кто понимает */
font-size: 18px;
font-family:'Times New Roman', Times, serif;
font-weight:bold;
position: absolute;
z-index: 9999;
width: 200px;
padding-top: 5px;
padding-left: 10px;
visibility: hidden;
height: 27px;
background-color: #ffffff;
}
</style>
<script type="text/javascript">
function down() {
var znachenie = document.getElementById('proverka').value.toLowerCase();
var massiv = ['Серова 1-й ','8 Марта ','Банбана ','Боровая ','Воркутинская ',
'Савина ','Восточная ','Геологов ','Димитрова ','Дуговая ',
'Интинская ','Заводская ','Западная ','Зои Космодемьянской ','Интернациональная ',
'Карьерная ','Кирпичная ','Колхозный ','Комсомольская ','Кочпонская ',
'Красных Партизан ','Серова 2-й ','Авиационный переулок ','Береговая ','Братьев Жилиных ',
'Быковского ','Водника ','Вычегодская ','Гоголя ','Дальняя ',
'Домны Каликовой ','Емвальская ','Заводской ','Космодемьянской переулок ','Интернациональный переулок ',
'Карьерный проезд ','Кирульский переулок ','Комарова ','Красная Гора ','Крупской ',
'28 Невельской Дивизии ','Католикова ','Больничный проезд ','Бумажников ','Весенняя ',
'Водопьянова ','Гаражная ','Горького ','Депутатская ','Дорожная ',
'Загородная ','Земляная ','Ижемская ','Калинина ','Катаева ',
'Клары Цеткин ','Корткеросская ','Красноармейская ','Крутая ','Бабушкина ',
'Борисова ','Ветеранов ','Вороншорский проезд ','Гаражный проезд ','Громова ',
'Депутатский переулок ','Дружбы ','Журавского ','Заливная ','Зимняя ',
'Индустриальный переулок ','Карла Маркса ','Кирова ','Колхозная ','Коммунистическая ',
'Космонавтов ','Красноармейский ','Куратова ','Крутая ','Бабушкина ',
'Борисова ','Ветеранов ','Вороншорский проезд ','Гаражный проезд ','Громова ',
];
if (! znachenie) {
document.getElementById('test').innerHTML = '';
document.getElementById('test').style.visibility = 'hidden';
} else {
for (var i = 0; i < massiv.length; i++){
if (znachenie == massiv[i].substr(0, znachenie.length).toLowerCase()) {
document.getElementById('test').innerHTML = massiv[i];
document.getElementById('test').style.visibility = 'visible';
break;
};
}
}
}
function copy() {
var a = document.getElementById('proverka').value = document.getElementById('test').innerHTML ;
document.getElementById('test').innerHTML = '';
document.getElementById('test').style.visibility = 'hidden';
}
</script>
</head>
<body>
<input id="proverka" type="text" size="20" maxlength="50" name ="delivery_period_time" oninput="down()" >
<div id="test" onclick="copy()" class="block-search-result" ></div>
<h3>левый текст для проверки смишения</h3>
</body>
</html>