Я сделал несколько попыток, но опубликую свою проблему и мой последний успешный код.
Если вы знакомы с Sublime Text, это будет иметь смысл намного быстрее. Если нет, я сделаю все возможное, чтобы объяснить, но я определенно рекомендую программу в качестве примечания.
Цель состоит в том, чтобы сопоставить названия с заданной строкой поиска и выделить совпадение. Подвох заключается в том, что совпадение может быть в любом порядке, и оно не должно обозначать начало строки, и что строки разделяются пробелами в исходном вводе
Пример:
String to Match: "Hello World"
Does it match?
"hello" -> Yes!
"h w" -> Yes!
"el orl" -> Yes!
"World Hello" -> Yes!
"Hello Foo" -> No!
Так что ввод очень простителен. У меня это до такой степени, что я могу сопоставить текст и определить, показывать или нет результат. Я просто застрял в получении выделения для работы. Возможно, я придерживаюсь неправильного подхода, но вот что у меня есть:
$('#sdfilter').live('keyup change', function() {
var inText = $(this).val().trim(); //remove trailing whitespace
var blocks = $('.listing'); //blocks to loop through
$.each(blocks, function() {
var title = $(this).children('.title').text(); //the title in the block
if (matchAll(title, inText)) {
$(this).show();
} else {
$(this).hide();
}
})
})
matchAll = function(string, args) { //string= string to match, args= search input
var die = 0; //return switch
var checks = args.split(' '); //break input into array
$.each(checks, function() {
var myReg = new RegExp(this, 'i'); //search term to regex
if (!string.match(myReg)) { //if it doesn't match, kill the function
die = 1;
}
})
if (die == 1) {
return false;
} else {
return true;
}
}
Я пытался выполнить замену с помощью цикла $.each(checks, function() {...}), чтобы добавить теги <span>, но затем входная строка совпадает с самими тегами span, поскольку она повторяется.
Я нашел решения, которые очень близки, но не настолько динамичны, как я надеюсь. Итак, мой официальный вопрос: я двигаюсь в правильном направлении? И если да, то что мне здесь не хватает?
EDIT
Извините, наверное, я не достаточно ясно. Мне нужно знать, как двигаться вперед, чтобы то, что соответствует, было выделено. Используя приведенный выше пример и '[]' для обозначения выделения
String to Match: "Hello World"
Does it match?
"hello" -> Yes! -> "[Hello] World"
"h w" -> Yes! -> "[H]ello [W]orld"
"el orl" -> Yes! -> "H[el]lo W[orl]d"
"World Hello" -> Yes! -> "[Hello] [World]"
"Hello Foo" -> No! -> **hidden
Подсветка выполняется путем обертывания совпадений в span теги
РЕДАКТИРОВАТЬ 2
При попытке выполнить что-то вроде string = string.replace(myReg, '<span>' + this + '</span>') (в качестве оператора else для if (!string.match(myReg))) я получаю совпадение самих элементов <span>. Я полагаю, этого можно ожидать, так как один и тот же вход повторяется многократно. Есть ли способ исключить их из myReg? Малый кодовый блок для справки:
...
$.each(checks, function() {
var myReg = new RegExp(this, 'i'); //search term to regex
if (!string.match(myReg)) { //if it doesn't match, kill the function
die = 1;
} else {
string = string.replace(myReg, '<span>' + this + '</span>');
}
})
...