1 <!-- 加载 Jquery -->
2 <script src="../../js/jquery-1.12.4.min.js"></script>
3
4 <!-- 加载 Select2 -->
5 <link href="../../css/select2/select2.min.css" rel="stylesheet" />
6 <script src="../../js/select2/select2.min.js"></script>
7
8 <select id="rimsName" class="country w-20" data-placeholder="All">
9 <option value="0">All</option>
10 <option value="1">AR36 Disc</option>
11 <option value="2">AR36 Grooved Graphene Surface</option>
12 <option value="3">333333</option>
13 <option value="4">223333</option>
14 <option value="5">444444</option>
15 </select>
16
17 <div>
18 <table id="table-data" class="table table-bordered">
19 <thead class="bg-f1f1f1">
20 <tr class="text-center text-first" style="white-space: nowrap;">
21 <th>Item No</th>
22 <th>Model</th>
23 <th>Hole</th>
24 <th>Look</th>
25 <th>Access Holes</th>
26 <th>Drain Holes</th>
27 <th>Nipple Type</th>
28 <th>Bead Type</th>
29 <th>Weight</th>
30 <th>Qty</th>
31 <th>Price</th>
32 </tr>
33 </thead>
34 <tbody>
35 <tr class="table-center text-center line-tr">
36 <td>1</td>
37 <td><a href="#">AR36 Disc</a></td>
38 <td>28H</td>
39 <td>Matte 3K</td>
40 <td>With</td>
41 <td>Without</td>
42 <td>External</td>
43 <td>Hookless</td>
44 <td>444g</td>
45 <td>1</td>
46 <td>
47 <p class="mb-0">$85.00</p>
48 <p class="my-1 font-14 color-999">Reg $170.00</p>
49 <button type="button" class="btn btn-primary btn-sm" onclick="addCart(this)">Add to Cart</button>
50 </td>
51 </tr>
52 <tr class="table-center text-center line-tr">
53 <td>2</td>
54 <td><a href="#">AR36 </a>Grooved Graphene Surface</td>
55 <td>20H</td>
56 <td>Matte UD</td>
57 <td>With</td>
58 <td>Without</td>
59 <td>Internal</td>
60 <td>Hooked</td>
61 <td>439g</td>
62 <td>1</td>
63 <td>
64 <p class="mb-0">$94.53</p>
65 <p class="my-1 font-14 color-999">Reg $189.05</p>
66 <button type="button" class="btn btn-primary btn-sm" onclick="addCart(this)">Add to Cart</button>
67 </td>
68 </tr>
69 </tbody>
70 </table>
71 </div>
72
73 <script>
74 $(function(){
75 $("#rimsName").select2();
76
77 $("#rimsName").change(function () {
78 console.log($("#rimsName").select2('data')[0].text, typeof $("#rimsName").select2('data')[0].text);
79 console.log($("#rimsName").select2('val'));
80 var datas = $("#rimsName").select2('data')[0].text;
81 var dataVal = $("#rimsName").select2('val');
82 if(dataVal > 0){
83 $("#table-data>tbody>tr").hide()
84 .filter(":contains('" + (datas) + "')")
85 .show();
86 }else{
87 $("#table-data>tbody>tr").show();
88 }
89 })
90 })
91
92 </script>
