<div class="codetitle"> <span><a style="CURSOR: pointer" data="94526" class="copybut" id="copybut94526" onclick="doCopy('code94526')"><u>コードをコピー</u></a></span> コードは次のとおりです:</div> <div class="codebody" id="code94526"> <br><%@ Page Language="C#" AutoEventWireup="true" CodeFile="JquerySort.aspx.cs" Inherits="demo_JquerySort" %> <br><br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > <br><br><html xmlns="http://www.w3.org/1999/xhtml"> <br><head runat="server"> <br><title>Jquery分类</title> <br><script src="../Scripts/jquery-1.4.4.min.js" type="text/javascript"></script> <br><script type="text/javascript"> <br>$(function () { <br>//品牌 <br>var alink01 = $("#linktype01").find("span"); <br>alink01.click(function () { <br> alink01.each(function () { <br>$(this).removeClass("templinkactive").addClass("templink"); <br>}); .addClass("templinkactive"); <br>$("#Brand").val($(this).attr("tag")) <br><br>//价格 <br>var alink02 = $("#linktype02").find("span"); <br>alink02.click(function () { <br>alink02.each(function () { <br>$(this).removeClass ("templinkactive").addClass("templink"); <br>$(this).removeClass("templink").addClass("#Price"); ).val($(this).attr("tag")); <br>}) <br><br>//尺寸 <br>var alink03 = $("#linktype03").find("span" ); <br>alink03.click(function () { <br>alink03.each(function () { <br>$(this).removeClass("templinkactive").addClass("templink"); <br>} ); <br>$(this).removeClass("templink").addClass("templinkactive"); <br>$("#Size").val($(this).attr("tag"); <br>SetPara(); <br>}) <br>}); <br><br><br>function SetPara() { <br>var a = $("#Brand").val(); <br>var b = $("#Price").val(); <br>var c = $("#Size").val(); <br>alert("1.aspx?a=" a "&b=" b "&c=" c); <br>}; <br></script> <br><style type="text/css"> <br>.templinkactive <br>{ <br>padding:5px; <br>テキスト装飾:なし; <br>背景色: #2788DA; <br>色:#ffffff; <br>} <br>.templink <br>{ <br>カーソル:ポインタ; <br>パディング:5px; <br>テキスト装飾:なし; <br>} <br>テーブル tr{ 高さ:35px;}<br></style> <br></head> <br> <br><form id="form1" runat="server"> <br><div> <br> <br><tr id="linktype01"> <br><td style="width:100px"> <br><b>笔记本品牌</b> <br></td> <br><td> <br><span class='templinkactive' tag="0">無制限</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100101">联想(Lenovo)</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100102">宏碁(Acer)</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100103">华硕(ASUS)</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100104">戴尔(DELL)</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100105">苹果(Apple)</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100106">三星(SAMSUNG)</span> <br></td> <br></tr> <br><tr id="linktype02"> <br><td style="width:100px"> <br><b>价格范围</b> <br></td> <br> </td> <td> <br><span class='templinkactive' tag="0">無制限</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100201">1000-2999</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100202">3000-3499</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100203">4000-4499</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100204">5000-5999</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100205">6000-6999</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100206">7000及び以上</span> <br></td> <br></tr> <br><tr id="linktype03"> <br><td style="width:100px"> <br><b>尺寸范围</b> <br></td> <br> </td> <td> <br><span class='templinkactive' tag="0" >無制限</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100301">8.9英寸以下</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100302">11英寸</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100303">12英寸</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100304">13英寸</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100305">14英寸</span> <br></td> <br> </td> <td> <br><span class='templink' tag="100306">15英寸及び</span> <br><input type="hidden" id="ブランド" value="0" /> <br><input type="hidden" id="価格" value="0" /> <br><input type="hidden" id="Size" value="0" /> <br></td> <br></tr> <br></table> <br> <br></form> <br></body> <br></html> <br> </td> </div> </div>