Javascript 每次在自动完成文本字段中输入字符时，都会调用两次Jquerymobile-1.4.0 keyUp事件

我使用了jQuery移动站点的示例

它工作正常，但当我试图在

listviewbeforefilter

事件中的脚本中发出警报时，它会显示警报3次，因此当输入3个字符时，它会提示7-9次

为什么会显示这么多警报？我认为它应该只在插入字符时提示一次。 以下是用于自动完成的代码重新运行脚本：

$( document ).on( "pageinit", "#myPage", function() {
        alert("abc");

            $( "#autocomplete" ).on( "filterablebeforefilter", function ( e, data ) {


                var $ul = $( this ),
                    $input = $( data.input ),
                    value = $input.val(),
                    html = "";
                $ul.html( "" );
                alert("789");
                if ( value && value.length > 2 ) {

                    $ul.html( "<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>" );
                    $ul.listview( "refresh" );
                    $.ajax({
                        url: "http://gd.geobytes.com/AutoCompleteCity",
                        dataType: "jsonp",
                        crossDomain: true,
                        data: {
                            q: $input.val()
                        }
                    })
                    .then( function ( response ) {
                        alert("123");
                        $.each( response, function ( i, val ) {
                            html += "<li>" + val + "</li>";
                        });
                        $ul.html( html );
                        $ul.listview( "refresh" );
                        $ul.trigger( "updatelayout");
                    });
                }
            });
           });

$（document）.on（“pageinit”，“myPage”，function（）{
警报（“abc”）；
$（“#自动完成”）。关于（“FilterableBeforFilter”，函数（e，数据）{
var$ul=$（此），
$input=$（data.input），
value=$input.val（），
html=“”；
$ul.html（“”）；
警报（“789”）；
如果（value&&value.length>2）{
$ul.html（“
”）；
$ul.列表视图（“刷新”）；
$.ajax({
url:“http://gd.geobytes.com/AutoCompleteCity",
数据类型：“jsonp”，
跨域：是的，
数据：{
q:$input.val（）
}
})
.然后（功能（响应）{
警报（“123”）；
$。每个（响应、功能（i、val）{
html+=“
”+val+“
”；
});
$ul.html（html）；
$ul.列表视图（“刷新”）；
$ul.trigger（“updatelayout”）；
});
}
});
});

以下是body标记中的代码返回：

<div data-role="content">
<h3>Cities worldwide</h3>
<p>After you enter <strong>at least three characters</strong> the autocomplete `function will show all possible matches.</p>
<ul id="autocomplete" data-role="listview" data-inset="true" data-filter="true" `data-filter-placeholder="Find a city..." data-filter-theme="a">
</ul>
</div>

全球城市
输入至少三个字符后，“自动完成”功能将显示所有可能的匹配项

用代码提供您的尝试，最好是在JSFIDLE中，这样我们就可以看到您在realAs@doniyor中尝试了什么，并声明您需要提供一个源代码示例。您的问题可能与多事件绑定有关，但如果无法在您的代码中确认，我们将无法为您提供答案。我已使用@Gajotres使用的代码更新了问题