input按下Enter键盘触发函数

<div class="form-inline">
                <div class="form-group">
                    <label for="inputSearch" class="sr-only">{$content.SEARCH}</label>
                    <i class="iconSearch"><img data-img="img" data-field="search" src="{$picture.search}"
                            alt="icon"></i>
                    <input type="search" class="form-control" id="inputSearch" data-text="text"
                        data-field="s-placeholder" placeholder="Tell us what you’re looking for…">
                </div><button type="button" class="btn search-for pcShow" onclick="AjaxSearchCategoryProduct()"
                    data-text="text" data-field="s-for">{$content.sf}</button>
                <div class="mobileShow text-center" style="width:100%;">
                    <button type="button" class="btn search-for" onclick="AjaxSearchCategoryProduct()" data-text="text"
                        data-field="s-for">{$content.sf}</button>
                </div>
            </div>
$(".form-control").keypress(function (even) {
    if (even.which == 13) {
        console.log("ok")
        AjaxSearchCategoryProduct();
    }
});


function AjaxSearchCategoryProduct() {
    num = 0;
    var keyword = $("#inputSearch").val();
    var currentCategoryID = $("#currentCategory").data("id");
    var data = {
        search: keyword,
        category_id: currentCategoryID
    };
    var html = "";
    $.ajax({
        url: "/product/search",
        type: "POST",
        data: data,
        success: function (r) {
            var len = r.data.length;
            $(".view-more").hide();
            for (var i = 0; i < len; i++) {
                html += `
                    <div class="width-box25">
                        <div class="product-item">
                            <div class="pro-img">
                                <img src="${r.data[i].images[0]}" alt="product img">
                            </div>
                            <div class="pro-title">
                                ${r.data[i].name}</br>
                                ${r.data[i]['item_no']}
                            </div>
                            <div class="pro-param">
                                <div class="param-wrap left-wrap">
                                    <div class="top-key">${r.data[i].voltgae}</div>
                                    <div class="bottom-value">${r.data[i].voltgae1}</div>
                                </div>
                                <div class="param-wrap middle-wrap">
                                    <div class="top-key">${r.data[i].power}</div>
                                    <div class="bottom-value">${r.data[i].power1}</div>
                                </div>
                                <div class="param-wrap right-wrap">
                                    <div class="top-key">${r.data[i].speed}</div>
                                    <div class="bottom-value">${r.data[i].speed1}</div>
                                </div>
                            </div>
                            <a href="/product/detail/id/${r.data[i].id}" class="view-more-btn-p">VIEW MORE</a>
                        </div>
                    </div>
                    `;
            }
            $(".pro-list .list-wrap").html(html);
        }
    });
}

防止input按下Enter键后自动刷新方法:

1.去掉form标签。


版权声明:本文为weixin_39089928原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。