2016-05-23 4 views
-5

Я создаю поисковую систему в ASP.NET, которая покажет продукты, а не ссылки, мой вопрос - это то, что является трюком или функцией javascript, когда пользователь вводит свой поиск в строке поиска, результаты, такие как google, я хочу, чтобы эта функциональность в моей поисковой системеСоздание поисковой системы, как google

+0

не уверен, что вы после этого. Является ли это функцией автозаполнения? вы можете уточнить? –

+0

Я имею в виду, это довольно конкретное действие. Я не думаю, что для этого есть «трюк» или универсальная функция javascript. Вы просто должны написать код. – Jonesopolis

+0

У вас есть скриншот, который объясняет? –

ответ

0

$("header input").on("input", function(){ 
 
    if(this.value.length > 0){ 
 
    $("header").addClass("hasValue"); 
 
    } 
 
});
*{box-sizing: border-box; margin:0;} 
 

 
header{ 
 
    position: absolute; 
 
    top:50%; left:50%; 
 
    transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); 
 
    text-align: center; 
 
    padding: 16px 24px; 
 
} 
 
header input{ 
 
    display: block; 
 
    vertical-align: top; 
 
    padding: 8px; 
 
    border-radius: 3px; 
 
    border:1px solid #ccc; 
 
} 
 
/* ONCE INPUT HAS VALUE: */ 
 
header.hasValue{ 
 
    position:relative; 
 
    top:0; left:0; 
 
    transform: translate(0%, 0%); -webkit-transform: translate(0%, 0%); 
 
    text-align:left; 
 
    background:#eee; 
 
} 
 
header.hasValue input{ 
 
    display:inline-block; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<header> 
 
    <img src="//placehold.it/80x33/f0f/fff?text=LOGO" alt="LOGO"> 
 
    <input type="search" placeholder="Search products"> 
 
</header>

+1

спасибо за понимание, что я пытался задать –

+1

@MuhammadMateen, пожалуйста. Пожалуйста, в следующий раз покажите немного HTML, CSS того, что вы пробовали, было бы легче начать откуда-то, а не делать все с нуля! Счастливое кодирование –

+0

J-запрос не работает для меня, я думаю, или мой CSS ошибочен, я также установил j-запрос в моем проекте и вставлял его в свой заголовок в проекте asp.net, но всякий раз, когда я что-то писал, ничего не случилось, я знаю, почему Я думаю, что j-запрос внутри тега скрипта не работает для меня или, пожалуйста, помогите –

0

Я не знаю, как вы строите поисковую систему электронной коммерции портала, нет какого-либо трюк, за что. вы можете достичь аналогичной функциональности в путях. Предлагаю взглянуть на основы.

https://jqueryui.com/autocomplete/

Смежные вопросы