Jquery скрипт ничего не делает на одной странице, а на другой

Question

У меня есть небольшой скрипт JQuery, полученный от парня с иностранной страницей.

$(function () {
    var $txt = $('input[id$=TextBoxFiltroProv]');
    var $ddl = $('select[id$=DropDownListProv]');
    var $items = $('select[id$=DropDownListProv] option');

    $txt.keyup(function () {
        searchDdl($txt.val());
    });

    function searchDdl(item) {
        $ddl.empty();
        var exp = new RegExp(item, "i");
        var arr = $.grep($items,
                function (n) {
                    return exp.test($(n).text());
                });

        if (arr.length > 0) {
            countItemsFound(arr.length);
            $.each(arr, function () {
                $ddl.append(this);
                $ddl.get(0).selectedIndex = 0;
            }
                );
        }
        else {
            countItemsFound(arr.length);
            $ddl.append("<option>No Items Found</option>");
        }
    }

    function countItemsFound(num) {
        $("#para").empty();
        if ($txt.val().length) {
            $("#para").html(num + " items found");
        }
    }
});

Он работает на странице, которая уже отрисовала все (элементы управления HTML) и имеет некоторые элементы внутри панели обновления. Но на другой странице у меня есть 2 панели обновления и одна панель (она скрыта). Элементы управления находятся внутри панели ASP.net. ¿Проблема в том, что элементы управления скрыты? И в этом случае ¿Как я могу сказать JQuery запустить этот кусок кода, когда панель видима и ее элементы управления визуализированы? Я думаю, что что-то пропустил, но не вижу этого. Благодарю.

Answer 1

Я решил эту проблему, это было из-за панелей обновления, я добавил следующий код, окружил свой основной код функцией, называемой BindEvents, и на панели обновления я добавил этот скрипт:

 <asp:UpdatePanel...>
<ContentTemplate>
     <script type="text/javascript">
                    Sys.Application.add_load(BindEvents);
     </script>
</ContentTemplate>
    </asp:UpdatePanel>

Answer 2

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

Ниже приведен пример, где на document Я хочу связать любой элемент с данным селектором input[id$=TextBoxFiltroProv] к keyupevent что существует onload или добавляется в DOM после document является ready,

Пример:

$(document).on('keyup', 'input[id$=TextBoxFiltroProv]', function () {
      searchDdl($(this).val());
});