標籤：min text enter char height mit htm tab 引入
一個小小的本地搜尋功能，僅用於示範 更多運用還請自行思量，經個人測試可以使用（注意在head引入 Jquey庫）
1 <html> 2 3 <head> 4 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 6 7 8 9 <title>本地搜尋</title>10 <script type="text/javascript" src="jquery-1.7.2.min.js"></script>11 <style>12 table{width:700px; border:1px solid #abcdef; border-collapse:collapse; }13 tr{height: 30px;}14 th,td{border: 1px solid #abcdef; text-align:center;}15 </style>16 17 </head>18 19 <body>20 <table>21 <tr id="header">22 <th>姓名</th>23 <th>性別</th>24 <th>電話</th>25 </tr>26 <tr>27 <td>張三</td>28 <td>男</td>29 <td>13965423687</td>30 </tr>31 <tr>32 <td>李四</td>33 <td>男</td>34 <td>18678953258</td>35 </tr>36 37 <tr>38 <td>移動客服</td>39 <td>女</td>40 <td>10086</td>41 </tr>42 <tr>43 <td>移動儲值</td>44 <td>女</td>45 <td>13800138000</td>46 </tr>47 48 49 </table>50 </br>51 <input type="text" name="" id="inserter"/>52 <input type="button" name="" id="dosubmit" value="搜尋"/>53 54 55 56 </body>57 </html>58 <script type="text/javascript">59 $(document).ready(function(){60 $("input[type=button]").click(function(){61 62 var valu = $("#inserter").val();63 $("table tr:not(‘#header‘)").hide().filter(‘:contains("‘+valu+‘")‘).show();64 65 });66 });67 </script>
使用Jquery本地搜尋內容
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
