<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标签。