Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.10.2018, 16:39
Интересующийся
Отправить личное сообщение для ellexpron Посмотреть профиль Найти все сообщения от ellexpron
 
Регистрация: 12.10.2018
Сообщений: 12

Поиск по всплывающему списку
Добрый день!

Имеется код, который был взят из Интернета. Код работает, но требуется сделать так, чтобы при нахождении требуемой строки, при её нажатии срабатывала гиперссылка на "https://...".
Пример - я пишу "адрес абон.." он находит строку "'Адрес абонентского отдела/ЦПО',". Требуется, чтобы при нажатии на эту строку, происходила переадресация. Подскажите код на двух строках, пожалуйста. Или имеется возможность облегчить код?
<html xmlns="http://www.w3.org/1999/xhtml">
<BODY>
<div id="podst"></div>
<INPUT type="text" class="opis" />
 
<script>
var streetArr=[
'Адрес абонентского отдела/ЦПО',
'Время работы абонентского отдела/ЦПО',
'Настройка роутера',
'Настройка модема',
].sort();
 
 
document.onkeyup=function(e)
{
e=e||window.event;
E=e.srcElement||e.target;
if(E.className=="opis")
    {
    current_Target=E;
        var autocompl='';
        var m=0;
        for(var i=0;i<streetArr.length;i++)
                {
                if(streetArr[i].toLowerCase().indexOf(current_Target.value.toLowerCase())!=-1)
                    {
                    autocompl+="<option value='"+streetArr[i]+"'>"+streetArr[i]+"<\/option>";m++;
                    }
                }
        if(autocompl!="")
            {if(m>20){m=20}
            document.getElementById("podst").innerHTML='\
            <select  \
            multiple size='+m+' >'+autocompl+'<\/select>';
            }
        else{}
    }
}
 
 
</SCRIPT>
</BODY>
</html>

Последний раз редактировалось ellexpron, 12.10.2018 в 16:43.
Ответить с цитированием
  #2 (permalink)  
Старый 12.10.2018, 16:50
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,700

<ul>
   <li><a href = "https://javascript.ru/forum/">Форум JavaScript</a></li>
   <li><a href = "https://learn.javascript.ru/">Учебник JavaScript</a></li>
</ul>
Ответить с цитированием
  #3 (permalink)  
Старый 12.10.2018, 17:11
Интересующийся
Отправить личное сообщение для ellexpron Посмотреть профиль Найти все сообщения от ellexpron
 
Регистрация: 12.10.2018
Сообщений: 12

Сообщение от Dilettante_Pro Посмотреть сообщение
<ul>
   <li><a href = "https://javascript.ru/forum/">Форум JavaScript</a></li>
   <li><a href = "https://learn.javascript.ru/">Учебник JavaScript</a></li>
</ul>
Подскажи, пожалуйста, а в какие строки вписать?
Ответить с цитированием
  #4 (permalink)  
Старый 12.10.2018, 17:30
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 2,481

ellexpron, Dilettante_Pro, предлагает вам использовать в кач-ве контейнера под результаты не select, а ul.
В этом случае никаких костылей с редиректами не понадобится писать.
Ответить с цитированием
  #5 (permalink)  
Старый 12.10.2018, 17:34
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,700

<html xmlns="http://www.w3.org/1999/xhtml">
<BODY>
<div id="podst"></div>
<INPUT type="text" class="opis" />
 
<script>
var streetArr=[
['Адрес абонентского отдела/ЦПО','https://javascript.ru/forum/'],
['Время работы абонентского отдела/ЦПО','https://javascript.ru/book'],
['Настройка роутера','https://learn.javascript.ru/'],
['Настройка модема','https://learn.javascript.ru/quiz'],
].sort();
 
 
document.onkeyup=function(e)
{
var e=e||window.event;
var E=e.srcElement||e.target;
if(E.className=="opis")
    {
    current_Target=E;
        var autocompl='';
        var m=0;
        for(var i=0;i<streetArr.length;i++)
                {
                if(streetArr[i][0].toLowerCase().indexOf(current_Target.value.toLowerCase())!=-1)
                    {
                    autocompl+="<option value='"+streetArr[i][1]+"'>"+streetArr[i][0]+"<\/option>";m++;
                    }
                }
        if(autocompl!="")
            {if(m>20){m=20}
            document.getElementById("podst").innerHTML='\
            <select  \
             multiple size='+m+' >'+autocompl+'<\/select>';
            }
        else{}
    }
}
document.onclick=function(e)
{ 
   var e=e||window.event;
   var E=e.srcElement||e.target;
   if(E.tagName=="OPTION") {
      window.location = E.value;
   }
}
</SCRIPT>
</BODY>
</html>

Последний раз редактировалось Dilettante_Pro, 12.10.2018 в 17:52.
Ответить с цитированием
  #6 (permalink)  
Старый 14.10.2018, 14:50
Интересующийся
Отправить личное сообщение для ellexpron Посмотреть профиль Найти все сообщения от ellexpron
 
Регистрация: 12.10.2018
Сообщений: 12

Скрипт работает отлично. Гиперссылки работают.
Проблема в том, что данный скрипт, который Вы написали, работает на всех браузерах, за исключением IE10+.
Нужно, чтобы скрипт работал на IE11, через который происходит работа.
На IE выдает следующую ошибку:


Последний раз редактировалось ellexpron, 14.10.2018 в 14:54.
Ответить с цитированием
  #7 (permalink)  
Старый 14.10.2018, 15:35
Интересующийся
Отправить личное сообщение для ellexpron Посмотреть профиль Найти все сообщения от ellexpron
 
Регистрация: 12.10.2018
Сообщений: 12

Может быть, стоит взять код попроще и использовать следующее?
<html>
<body>

<input list="browsers">

<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Google Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

</body>
</html>


Только гиперссылки не работают. Что я делаю не так?

<option value="https://vk.com/">Internet Explorer</option>
Ответить с цитированием
  #8 (permalink)  
Старый 14.10.2018, 16:46
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,260

Сообщение от ellexpron
На IE выдает следующую ошибку:
Окно "Привет из 90-х" 256 цветов прям ностальгия по вин98
Ответить с цитированием
  #9 (permalink)  
Старый 14.10.2018, 17:37
Интересующийся
Отправить личное сообщение для ellexpron Посмотреть профиль Найти все сообщения от ellexpron
 
Регистрация: 12.10.2018
Сообщений: 12

Сообщение от j0hnik Посмотреть сообщение
Окно "Привет из 90-х" 256 цветов прям ностальгия по вин98
Я делаю через CssMagic. Собственно, вопрос по сабжу.
Ответить с цитированием
  #10 (permalink)  
Старый 14.10.2018, 18:16
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,260

<html xmlns="http://www.w3.org/1999/xhtml">
<BODY>
<div id="podst"></div>
<INPUT type="text" class="opis" />
 
<script>
var streetArr=[
['Адрес абонентского отдела/ЦПО','https://javascript.ru/forum/'],
['Время работы абонентского отдела/ЦПО','https://javascript.ru/book'],
['Настройка роутера','https://learn.javascript.ru/'],
['Настройка модема','https://learn.javascript.ru/quiz'],
].sort();
 
 
document.onkeyup=function(e)
{
var e=e||window.event;
var E=e.srcElement||e.target;
if(E.className=="opis")
    {
    current_Target=E;
        var autocompl='';
        var m=0;
        for(var i=0;i<streetArr.length;i++)
                {
                if(streetArr[i][0].toLowerCase().indexOf(current_Target.value.toLowerCase())!=-1)
                    {
                    autocompl+="<option value='"+streetArr[i][1]+"'>"+streetArr[i][0]+"<\/option>";m++;
                    }
                }
        if(autocompl!="")
            {if(m>20){m=20}
            document.getElementById("podst").innerHTML='\
            <select  \
             multiple size='+m+' >'+autocompl+'<\/select>';
            }
        else{}
    }
}
document.onclick=function(e){ 

   var e=e||window.event;
   var E=e.srcElement||e.target;
   if(E.tagName=="OPTION" || E.value && E.tagName=="SELECT") {
      window.location = E.value;
   }
}
</SCRIPT>
</BODY>
</html>

Последний раз редактировалось j0hnik, 14.10.2018 в 18:24.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Поиск и замена слов по списку EvgenStor Общие вопросы Javascript 40 26.09.2017 04:29
select отключить встроенный поиск skynet-mfd jQuery 0 04.03.2013 10:26
Поиск в тексте javascript jQuery 3 31.05.2011 11:40
PagingToolbar и поиск DenQ ExtJS 5 02.11.2010 00:16
Поиск в массиве через JavaScript Noran Общие вопросы Javascript 0 10.08.2008 17:31