php結(jié)合js實(shí)現(xiàn)多條件組合查詢
更新時(shí)間:2019年05月28日 10:00:13 作者:苦的人生遇見甜
這篇文章主要為大家詳細(xì)介紹了php結(jié)合js實(shí)現(xiàn)多條件組合查詢,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
一、效果圖

二、前端代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Jquery分類</title>
<script src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script>
<style type="text/css">
.templinkactive {
padding:5px;
text-decoration:none;
color:red;
}
.templink {
cursor:pointer;
padding:5px;
text-decoration:none;
}
table{border:1px solid #ccc;}
table tr{ height:35px;}
</style>
<script type="text/javascript">
$(function () {
//品牌
var alink01 = $("#linktype01").find("span");
alink01.click(function () {
alink01.each(function () {
$(this).removeClass("templinkactive").addClass("templink");
});
$(this).removeClass("templink").addClass("templinkactive");
$("#Brand").val($(this).attr("tag"));
SetPara();
});
//價(jià)格
var alink02 = $("#linktype02").find("span");
alink02.click(function () {
alink02.each(function () {
$(this).removeClass("templinkactive").addClass("templink");
});
$(this).removeClass("templink").addClass("templinkactive");
$("#Price").val($(this).attr("tag"));
SetPara();
})
//尺寸
var alink03 = $("#linktype03").find("span");
alink03.click(function () {
alink03.each(function () {
$(this).removeClass("templinkactive").addClass("templink");
});
$(this).removeClass("templink").addClass("templinkactive");
$("#Size").val($(this).attr("tag"));
SetPara();
});
});
function SetPara() {
var Brand = $("#Brand").val();
var Price = $("#Price").val();
var Size = $("#Size").val();
alert("1.php?Brand=" + Brand + "&Price=" + Price + "&Size=" + Size);
// var keywords = $("#search").val();
// var skip_url = "http://" + window.location.hostname + window.location.pathname;
// var url = skip_url + "?s=/admin/goods/goods_list/Brand/"+Brand+"/Price/"+Price+"/Size/"+Size;
// window.location.href = url;
// alert(url);
};
</script>
<script type="text/javascript">
/*//TP框架-start
$(function(){
var Brand = $("#Brand").val();
var Price = $("#Price").val();
var Size = $("#Size").val();
// alert(tag);
if(Brand != ''){
$("#linktype01").find("span").removeClass("templinkactive").addClass("templink")
$('span[tag="'+Brand+'"]').css('color','red');
}
if(Price != ''){
$("#linktype02").find("span").removeClass("templinkactive").addClass("templink")
$('span[tag="'+Price+'"]').css('color','red');
}
if(Size != ''){
$("#linktype03").find("span").removeClass("templinkactive").addClass("templink")
$('span[tag="'+Size+'"]').css('color','red');
}
});
//TP框架-end*/
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr id="linktype01">
<td style="width:100px">
<b>筆記本品牌</b>
</td>
<td>
<span class='templinkactive' tag="0">不限</span>
</td>
<td>
<span class='templink' tag="100101">聯(lián)想(Lenovo)</span>
</td>
<td>
<span class='templink' tag="100102">宏碁(Acer)</span>
</td>
<td>
<span class='templink' tag="100103">華碩(ASUS)</span>
</td>
<td>
<span class='templink' tag="100104">戴爾(DELL)</span>
</td>
<td>
<span class='templink' tag="100105">蘋果(Apple)</span>
</td>
<td>
<span class='templink' tag="100106">三星 (SAMSUNG)</span>
</td>
</tr>
<tr id="linktype02">
<td style="width:100px">
<b>價(jià)格范圍</b>
</td>
<td>
<span class='templinkactive' tag="0">不限</span>
</td>
<td>
<span class='templink' tag="100201">1000-2999</span>
</td>
<td>
<span class='templink' tag="100202">3000-3499</span>
</td>
<td>
<span class='templink' tag="100203">4000-4499</span>
</td>
<td>
<span class='templink' tag="100204">5000-5999</span>
</td>
<td>
<span class='templink' tag="100205">6000-6999</span>
</td>
<td>
<span class='templink' tag="100206">7000及以上</span>
</td>
</tr>
<tr id="linktype03">
<td style="width:100px">
<b>尺寸范圍</b>
</td>
<td>
<span class='templinkactive' tag="0" >不限</span>
</td>
<td>
<span class='templink' tag="100301">8.9英寸及以下</span>
</td>
<td>
<span class='templink' tag="100302">11英寸</span>
</td>
<td>
<span class='templink' tag="100303">12英寸</span>
</td>
<td>
<span class='templink' tag="100304">13英寸</span>
</td>
<td>
<span class='templink' tag="100305">14英寸</span>
</td>
<td>
<span class='templink' tag="100306">15英寸及以上</span>
<input type="hidden" id="Brand" value="" />
<input type="hidden" id="Price" value="" />
<input type="hidden" id="Size" value="" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
三、服務(wù)端代碼
goodsController.class.php
<?php
public function goods_list(){
$Brand= I('Brand');
$Price= I('Price');
$Size= I('Size');
$this->assign('Brand',$Brand);
$this->assign('Price',$Price);
$this->assign('Size',$Size);
$this->display();
}
?>
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript必知必會(huì)(十) call apply bind的用法說明
這篇文章主要介紹了JavaScript必知必會(huì)(十) call apply bind的用法說明 的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06
JS中call apply bind函數(shù)手寫實(shí)現(xiàn)demo
這篇文章主要為大家介紹了JS中call apply bind函數(shù)手寫實(shí)現(xiàn)demo,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03
關(guān)于List.ToArray()方法的效率測(cè)試
這篇文章主要介紹了關(guān)于List.ToArray()方法的效率測(cè)試的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-09-09
uniapp抖音小程序一鍵獲取用戶手機(jī)號(hào)的示例代碼
文章介紹了如何在uniapp抖音小程序中通過點(diǎn)擊按鈕一鍵獲取用戶手機(jī)號(hào),encryptedData和iv通過點(diǎn)擊按鈕回傳,后端部分通過解密獲取手機(jī)號(hào),感興趣的朋友一起看看吧2024-12-12
javascript制作游戲開發(fā)碰撞檢測(cè)的封裝代碼
這篇文章主要介紹了javascript制作游戲開發(fā)碰撞檢測(cè)的封裝代碼,需要的朋友可以參考下2015-03-03

