поиск на странице
решил попробовать написать код поиска символов на странице самостоятельно, но хватило меня только на это
<form id="search" method="POST" action="" name="searchform"> <input id="ButtonSearch" type="submit" value="Найти"> <input id="textSearch" type="text" name="search" value="Поиск.."> </form>
var searchText = $('#textSearch').val();
$('#search').submit(function(){
if(searchText == 'Поиск..' || searchText == ''){
alert('Вы не заполнили поле ввода');
return false;
}
else{
globalSearch.call(searchText);
}
})
function globalSearch(myString){
var allElements = $('*');
var resultSearch;
for (var i = 0; i < allElements.length; i++) {
if(allElements.text() == myString){
resultSearch = myString;
$('.block_C').prepend('<p>' + resultSearch + '</p>');
}
};
}
Подскажите что не так, вроде логику соблюдал... |
почему 1 строка не в 3 скрипта?
|
sergeo_89,
:-?
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function ()
{
$('#search').submit(function()
{
var searchText = $('#textSearch').val();
if(searchText == 'Поиск..' || searchText == '') {
alert('Вы не заполнили поле ввода');
}
else {
globalSearch(searchText);
}
return false;
}
)
function globalSearch(myString) {
var allElements = $('*').not('.block_C');
for (var i = 0; i < allElements.length; i++) {
if($(allElements[i]).text() == myString) {
$('.block_C').prepend('<p>' + myString + '</p>');
}
};
}
}
)
</script>
</head>
<body>
<p>test</p>
<div class="block_C"></div>
<form id="search" method="POST" action="" name="searchform">
<input id="ButtonSearch" type="submit" value="Найти">
<input id="textSearch" type="text" name="search" value="Поиск..">
</form>
</body>
</html>
|
О Спасибо вам за помощь!) радует, что был близок)
|
sergeo_89,
for неправильно использовать в jquery для это есть each |
получается на jquery будет выглядеть так
function globalSearch(myString){
var allElements = $('*').not('.block_C');
allElements.each(function(){
if($(this).text() == myString) {
$('.block_C').prepend('<p>' + myString + '</p>');
}
})
}
))) |
sergeo_89,
да |
Цитата:
|
и снова тупик, конструкцией
$('*:not(.block_C)')
Я выбираю все элементы Тэги, Как же мне выбрать содержимое этих тэгов?! и плюс почему то не срабатывает код
$(function(){
$('#search').submit(function(){
var searchValue = $('#textSearch').val();
var searchText = $('#textSearch').text();
if(searchValue == '' || searchValue == 'Поиск..') {
alert('Вы не заполнили поле ввода');
}
else {
globalSearch(searchText);
}
return false;
})
function globalSearch(myString){
var regV = /\w\s\d[A-Za-z0-9-]+/g;
var result = myString.search(regV);
var allElements = ($('*:not(.block_C)'));
allElements.each(function(){
if($(this).text() == myString && result == -1) {
$(this).css('background','#F9FF82');
$('.block_C').prepend('<p>Результаты поиска:<br><br><span>' + myString + '</span><br><br></p>').addClass('searchResult');
}
else{
globalSearchRemove(myString);
}
})
}
function globalSearchRemove(myResults){
$('block_C p').fadeOut(300);
}
})
<form id="search" method="POST" action="" name="searchform"> <input id="ButtonSearch" type="submit" value="Найти"> <input id="textSearch" type="text" name="search" value="Поиск.."> </form> подскажите где тут прокол |
Цитата:
Цитата:
|
sergeo_89,
начиная со строки 23 и до конца скрипта идёт нелогичная конструция и ошибка в селекторе строка 30 |
sergeo_89,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.searchResult{
background: Aqua
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function(){
$('#search').submit(function(){
var searchValue = $('#textSearch').val();
if(searchValue == '' || searchValue == 'Поиск..') {
alert('Вы не заполнили поле ввода');
}
else {
globalSearch(searchValue);
}
return false;
})
function globalSearch(myString){
var regV = /\w\s\d[A-Za-z0-9-]+/g;
var result = myString.search(regV);
var allElements = $('*:not(".block_C, .block_C *")');
allElements.each(function(){
if($(this).text() == myString && result == -1) {
$(this).css('background','#F9FF82');
$('.block_C').prepend('<p>Результаты поиска:<br><br><span>' + myString + '</span><br><br></p>').addClass('searchResult');
}
else{
// globalSearchRemove(myString);
}
})
}
function globalSearchRemove(myResults){
$('.block_C p').fadeOut(300);
}
})
</script>
</head>
<body>
<p>test</p><p>notest</p>
<div class="block_C"></div>
<form id="search" method="POST" action="" name="searchform">
<input id="ButtonSearch" type="submit" value="Найти">
<input id="textSearch" type="text" name="search" value="Поиск..">
</form>
</body>
</html>
|
Спасибо большое за поправку.
Цитата:
а так у меня проблемма в том, что основной текст находится в блоке Д, который надо искать, и он не работает, там английский текст, что нужно дописать, Чтоб мои задачи были реализованы? а вообще наверно мне стоит сначала javaScript изучить... раз в таких простейших местах делаю ошибки... |
Цитата:
Цитата:
может готовое тут взять http://javascript.ru/forum/project/4...-v-tekste.html |
а все спасибо разобрался, вставил в событие submit
$('.block_C').html('');
и все заработало. осталось только разобраться почему ищет только одно слово (Главная). В готовом варианте слишком все сложно, да и самому лучше сделать, чтоб понять, Спасибо еще раз |
вот перевел проект в песочницу, посмотри пожалуйста, когда ввожу слово "Главная" все работает, когда "Lorem" нет. http://learn.javascript.ru/play/KQlDfc
и плюс не знаю как бы убрать background, если пользователь ввел другое значение в форму поиска |
sergeo_89,
так вы хотите часть текста -- так делайте test или search а не == Цитата:
|
| Часовой пояс GMT +3, время: 00:19. |