Как щелкнуть для выбора при использовании автозаполнения JQuery (ASP.NET, C #) - PullRequest
0 голосов
/ 30 января 2019

Я выполняю задачу, включающую автозаполнение для текстового поля с использованием Автозаполнение JQuery .

Один из файлов, который я использовал: jquery-ui.js

Затем мне нужно применить полужирный к сопоставленному тексту.Например, если я вставлю «Jav» в текстовое поле, они должны показать Jav a.

, и я применил эту часть, и она прошла успешно,

open: function (e, ui) {
    var acData = $(this).data('ui-autocomplete');
    acData
    .menu
    .element
    .find('li')
    .each(function () {
        var me = $(this);
        var keywords = acData.term.split(' ').join('|');
        me.html(me.text().replace(new RegExp("(" + keywords + ")", "gi"), 
        '<b>$1</b>'));
    });  
}

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

Результат доприменить код | Результат после применения кода

Кто-нибудь, помогите мне, спасибо:)

Ответы [ 2 ]

0 голосов
/ 30 января 2019

Кстати, исходя из того, что я нашел в интернете, просто нужно заменить это,

me.html(me.text().replace(new RegExp("(" + keywords + ")", "gi"), 
        '<b>$1</b>'));

на это,

me.html( me.text().replace(regex, function (matched) {
                            return termTemplate.replace('%s', matched);
                        }) );

и перед кодом:

$("#<%=test.ClientID %>").autocomplete({

Мне нужно поставить это,

var termTemplate = "<span class='ui-autocomplete-term'>%s</span>";

и создать CSS для .ui-autocomplete-term, который я вставил в text-weight: bold

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

0 голосов
/ 30 января 2019

Я считаю, что ваша проблема в том, что вы заменяете разметку html по умолчанию (необходимую для работы стиля OOB) на текстовое значение, вызывая:

me.html(me.text(.....));

Попробуйте получить html и вместо этого оберните ключевое словоиспользуя что-то вроде:

me.html().find(keywords).wrap( "<strong></strong>" )));
...