Мобильная клавиатура исчезает в окне поиска в Magento


На моей домашней странице есть окно поиска, в котором вы можете искать товары. Поэтому, когда пользователь начинает вводить продукт, появляется autosuggest.php что jQuery начинает искать продукты. Но проблема в том, что на устройствах Android, когда пользователь прикасается к окну поиска, клавиатура появляется, а затем снова исчезает. Это мой фрагмент кода:

(function($){

$(function(){

    $('#search').keyup(function () {
        var term = $(this).val();            

        if(term.length >= 2){
            $.getJSON(cvg.urls.base_url + 'autosuggest.php', {term:term, store:cvg.store.id}, function(json){
                var ac = $('#search_autocomplete');
                var rh = $('<div class="autocomplete_header">').text(cvg__('FREQUENT TERMS'));
                var ch = $('<div class="autocomplete_header">').text(cvg__('CATEGORIES'));
                var ph = $('<div class="autocomplete_header">').text(cvg__('PRODUCTS'));

                if( typeof json.products != 'undefined' && json.products.length > 4)
                    var pa = $('<div class="autocomplete_header view_all">')
                        .html('<a href="' + cvg.urls.store_url + 'catalogsearch/result/?q=' + term + '">' + cvg__('VIEW ALL') + '</a>');


                if( typeof json.freq_resutls != 'undefined') {
                    var rc = $('<ul class="autocomplete_container sr_freq_terms">');
                    for (var i = 0; i < json.freq_resutls.length; i++){
                        var li = $('<li>');
                        var a  = $('<a>')
                            .attr('href', cvg.urls.store_url + 'catalogsearch/result/?q=' + json.freq_resutls[i])
                            .text(json.freq_resutls[i]);

                        li.html(a);

                        rc.append(li);
                    }
                }


                if( typeof json.category != 'undefined') {
                    var cc = $('<ul class="autocomplete_container sr_cats">');
                    for (var i = 0; i < json.category.length; i++){
                        var li  = $('<li>');
                        var spa = $('<span>').text(json.category[i].name);
                        var a   = $('<a>')
                            .attr('href', cvg.urls.store_url + json.category[i].url_key + '.html')
                            .append(spa);
                        li.append(a);

                        cc.append(li);
                    }
                }

                if( typeof json.products != 'undefined') {
                    var pc = $('<ul class="autocomplete_container sr_prods">');
                    for (var i = 0; i < json.products.length; i++){
                        var li  = $('<li>');
                        var img = $('<img>').attr('src', json.products[i].img);
                        var p   = $('<p>').html('<span class="sr_prods_name">'+json.products[i].value+'</span><br/>'+'<i>'+json.products[i].sku+'</i>'+'<br/>'+json.products[i].descr);
                        var a   = $('<a>')
                            .attr('href', json.products[i].url)
                            .append(img)
                            .append(p);
                        li.append(a);

                        pc.append(li);

                        if(i == 3)
                            break;
                    }
                }

                ac.html('').show();

                if( typeof json.freq_resutls != 'undefined') {
                    ac.append(rh);
                    ac.append(rc);
                }
                if( typeof json.category != 'undefined') {
                    ac.append(ch);
                    ac.append(cc);
                }
                if( typeof json.products != 'undefined') {
                    ac.append(ph);
                    ac.append(pc);
                    ac.append(pa);
                }
            });
        }

    });

});

})(jQuery)

Есть ли здесь какая-либо часть, которая вызывает эту проблему? Любая помощь будет очень признательна.

Author: Stefanos, 2017-07-20

2 answers

Пожалуйста, попробуйте это

$(document).on('keyup','#search', function() {
   // code
});

Или

$(document).delegate('#search', 'keyup', function() {
    // code
});

Источник из https://stackoverflow.com/questions/10580295/jquery-keyup-not-working-on-android

 1
Author: Vino, 2017-07-20 14:17:36

Оказалось, что я смотрел не на тот файл. Мое поле поиска находилось в заголовке.phtml, и класс css, который был вызван, был другим. Таким образом, для реализации требовался только фокус jQuery:

$('.top-seaarch .quick-search').focus();
 0
Author: Stefanos, 2017-07-26 11:22:40