Реализация функции JavaScript для поиска в DIV, получение текстового диапазона для поиска - PullRequest
Новая
       34

Реализация функции JavaScript для поиска в DIV, получение текстового диапазона для поиска

0 голосов
/ 24 сентября 2011

Как мне получить textrange для поиска div (или формы)? Есть ли уже доступные сценарии или функции jquery, которые ищут текст в div?

Я добавляю форму в div с этим кодом: 

    $('#'+card_id).append('<form id="frm_search" name="frm_search" class="editableToolbar frm_search_links"> <input type="text" placeholder="Type a string..." name="linkcard_search_string" class="txt_form"> <a href="#" title="Search" class="ico_search btn_form" onClick="search_links(\''+card_id+'\', this.form); "></a> <a href="#" title="Close" class="ico_delete btn_form" onClick="close_search(\''+card_id+'\', this.form); "></a> </form>');

Я хотел бы иметь функцию поиска, которая будет искать только строку в этом div. Я указываю диапазон текста следующим образом.

txt = window.document.body.getelementbyid(card_id).createTextRange();

Функция поиска - это функция, которую я нашел в сети и которую я пытаюсь обновить для поиска в div вместо всей страницы. На странице будет несколько разделов, и я хочу, чтобы поиск был специфичным для каждого. Я вызываю эту функцию из search_links(card_id);. 

function search_links (card_id, form) {
    var search_str = document.frm_search.linkcard_search_string.value;
    /* alert('search_links '+search_str); */
    return search_linkcard(search_str, card_id);
}

var IE4 = (document.all);
var n   = 0;
function search_linkcard(str, card_id) {

  alert (card_id + ' ' + str);
  var txt, i, found;

  if (str == "")
    return false;

  // Find next occurance of the given string on the page, wrap around to the
  // start of the page if necessary.

  if (IE4) {
    txt = window.document.body.getelementbyid(card_id).createTextRange();

    // Find the nth match from the top of the page.

    for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) {
      txt.moveStart("character", 1);
      txt.moveEnd("textedit");
    }

    // If found, mark it and scroll it into view.

    if (found) {
      txt.moveStart("character", -1);
      txt.findText(str);
      txt.select();
      txt.scrollIntoView();
      n++;
    }

    // Otherwise, start over at the top of the page and find first match.

    else {
      if (n > 0) {
        n = 0;
        search_linkcard(str, card_id);
      }

      // Not found anywhere, give message.

      else
        alert("Not found.");
    }
  }

  return false;
}

У меня есть конкретные вопросы в начале вопроса: как мне указать диапазон текста для div? Правильный ли у меня синтаксис? Есть ли сценарии, которые уже делают то, что я хочу, то есть поиск содержимого определенного div?

1 Ответ

0 голосов
/ 20 октября 2011

Сделал поиск с помощью: содержит.Не делать один матч за раз.Выделены все совпадения. 

// Open search
function open_search(card_id) {

    $('#'+card_id).append('<form id="frm_search" name="frm_search" class="editableToolbar frm_search_links"> <input type="text" placeholder="Type a string..." name="linkcard_search_string" class="txt_form" onclick="clear_search(\''+card_id+'\', this.form);"> <a href="#" title="Search" class="ico_search btn_form" onClick="search_links(\''+card_id+'\', this.form); "></a> <a href="#" title="Close" class="ico_delete btn_form" onClick="close_search(\''+card_id+'\', this.form); "></a> </form>');

    var frm_elements = frm_search_link.elements;
    for(i=0; i<frm_elements.length; i++) {
        field_type = frm_elements[i].type.toLowerCase();
        switch (field_type)
        {
            case "text":
                frm_elements[i].value = ""; 
                break;

            default:
                break;
        }
    }

}

// Close search
function close_search(card_id, form) {
    $('form.frm_search_links', $('#'+card_id)).remove();
    var card_select = '#'+card_id;
    $('.link',$(card_select)).removeClass('search_results');        
}

// Search links
function search_links (card_id, form) {
    var search_str = document.frm_search.linkcard_search_string.value;
    var search_select = '.link:contains('+search_str+')';
    var card_select = '#'+card_id;
    var result = $(search_select,$(card_select)).addClass('search_results');
    if (result.length == 0 || result.length == null) document.frm_search.linkcard_search_string.value = 'Not found.';
}

// Clear search
function clear_search (card_id, form) {
    document.frm_search.linkcard_search_string.value = '';
    var card_select = '#'+card_id;
    $('.link',$(card_select)).removeClass('search_results');        
}
...