2012-06-25 7 views
1

история до сих пор ....JQuery - расчесывание селекторы в том числе: содержит

Здравствуйте Stackoverflowers, меня снова! Правильно, я изучаю JQuery на данный момент, и я хочу построить «Поиск по мере ввода» AJAX/JSON control. Таким образом, vie отправился в JSFiddle, чтобы построить скелетную функцию и построить на ней, учиться, когда я иду. Вы помогли мне в последние несколько дней, так что спасибо:

JQuery - Using Selector :contains - Weird Results

JQuery - Iterating JSON Response

Теперь им перейти на показывая только выбранные элементы списка, которые соответствуют вход.

«так что ваша проблема сейчас ..» Я вот стону! (и да, rlemon у меня есть электронная книга сейчас!) :)

JQuery nOOb проблема часть 3: несколько селекторов.

Ive были с помощью руководства JQuery Multiple Selectors API, так что я понимаю, как включить несколько селекторов, но проблема в том, что шахта ничего не выбирает, т.е. : содержит это ничего не найти. Является ли это неправильно, ив используется JSLint и он правильно разобран без ошибок:

$("li[id^='live'] li:contains('" + this.value + "')").show(); 

Мой полный код JSFiddle здесь, но я включил его для удобства, а также:

http://jsfiddle.net/garfbradaz/JYdTU/88/

$(document).ready(function() { 
var $input = $("#livesearchinput"), 
    filled = false; 
$.ajaxSetup({ 
    cache: false 
}); 
$input.keyup(function(key) { 
    if (!filled) { 
     filled = true; 
     $.getJSON("/gh/get/response.json//garfbradaz/MvcLiveSearch/tree/master/JSFiddleAjaxReponses/", function(JSONData) { 
      var $ul = 
      $('<ul>').attr({ 
       id: "live-list" 
      }).appendTo('div#livesearchesults'); 
      $.each(JSONData, function(i, item) { 
       $.each(item, function(j, val) { 
        $('<li>').attr({ 
         id: "live-" + val 
        }).append(val).appendTo($ul).hide(); 
       }); 
      }); 
     }); 
    } 

    var n = 0; 

    if (this.value !== "") { 
     n = $("li:contains('" + this.value + "')").length; 
     n2 = $("li[id^='live'] li:contains('" + this.value + "')").length; 
     console.log("1. value of n2 equals " + n2 + " : " + this.value + "end"); 


    } 
    else { 
     n = 0; 
    } 

    if (n <= 0) { 
     $('li[id ^= "live"]').hide("slow"); 
     console.log("1. value of n equals " + n + " : " + this.value + "end"); 
    } 

    if (n > 0) { 
     $("li[id^='live'] li:contains('" + this.value + "')").show(); 
     console.log("2. value of n equals " + n + " : " + this.value + "end"); 
    } 


}); 

}

Что делает ive сделано console.log n2 всегда 0, и вот журнал f12 для Доказательство:

proof

Так что мой вопрос, являются:

  1. Как я могу исправить несколько селектор включить : содержит, так что я знаю будущее
  2. Если я даже использовать: содержит, или я должен подойти по-другому и использовать .filter()? Перед публикацией я исследовал этот вопрос и нашел хороший стек ответ с подробным описанием использования этого:

JQuery Contains Selector - Multiple Text Items

ответ

1

В вашем случае вам нужно только объединить два селекторы: li id starts with и li contains. Аналогичная часть каждого селектора равна li, поэтому начните с li и добавьте два других.

$("li[id^='live']:contains('" + this.value + "')").length; 

http://jsfiddle.net/JYdTU/89/

Я только обновил одну строку, чтобы правильно сделать вывод на консоль, вам придется пройти через скрипку и обновить остальное.

+0

Удивительный Кевин, спасибо. – garfbradaz

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