欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js實現(xiàn)篩選功能

 更新時間：2020年11月24日 17:30:15   作者：wjianbo  
這篇文章主要為大家詳細介紹了js實現(xiàn)篩選功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下

本文實例為大家分享了js實現(xiàn)篩選功能的具體代碼，供大家參考，具體內(nèi)容如下

功能

通過復選框?qū)︼@示內(nèi)容進行篩選，如，勾選后僅顯示在線用戶。

代碼

js

※需 jQuery。

function filter() {
 var check =document.getElementById('checkbox');
 var members = $('.member');
 var status = $('.memberStatus');
 if (check.checked) {
 members.each(function(i, member) {
 if (status[i].innerText == 'Offline') {
 member.style.display = 'none';
 }
 });
 } else {
  members.each(function(i, member) {
   member.style.display = '';
  });
 }
}

html

<input type="checkbox" name="onlineOnly" tabindex="0" id="checkbox" onclick="filter()">
<span>Show online users only</span>
<table>
 <tr class="member">
 <td>
  UserA
 </td>
 <td class="memberStatus">
  Online
 </td>
 </tr>
 <tr class="member">
 <td>
  UserB
 </td>
 <td class="memberStatus">
  Offline
 </td>
 </tr>
 <tr class="member">
 <td>
  UserC
 </td>
 <td class="memberStatus">
  Online
 </td>
 </tr>
</table>

以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

相關文章

  • Javascript使用uploadify來實現(xiàn)多文件上傳

    Javascript使用uploadify來實現(xiàn)多文件上傳

    本篇文章主要介紹了Javascript使用uploadify來實現(xiàn)多文件上傳，具有一定的參考價值，有需要的可以了解一下。
    2016-11-11
  • JavaScript類的寫法

    JavaScript類的寫法

    這篇文章主要為大家詳細介紹了JavaScript類的寫法,具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2016-09-09
  • 小程序?qū)崿F(xiàn)登錄功能

    小程序?qū)崿F(xiàn)登錄功能

    這篇文章主要為大家詳細介紹了小程序?qū)崿F(xiàn)登錄功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2022-09-09
  • 對TypeScript庫進行單元測試的方法

    對TypeScript庫進行單元測試的方法

    這篇文章主要介紹了對TypeScript庫進行單元測試的方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2019-07-07
  • JavaScript多級判定代碼優(yōu)化淺析

    JavaScript多級判定代碼優(yōu)化淺析

    這篇文章主要介紹了JavaScript多級判定代碼優(yōu)化，JavaScript用二元運算符和if拆分優(yōu)化多級判定結(jié)構(gòu),?用JavaScript邏輯運算符替換if-else結(jié)構(gòu)判定
    2023-02-02
  • 微信小程序自定義toast彈窗效果的實現(xiàn)代碼

    微信小程序自定義toast彈窗效果的實現(xiàn)代碼

    微信小程序里面的自帶彈窗icon只有兩種，success和loading。這篇文章主要介紹了微信小程序之自定義toast彈窗效果的實現(xiàn)代碼 ,需要的朋友可以參考下
    2018-11-11
  • Router解決跨模塊下的頁面跳轉(zhuǎn)示例

    Router解決跨模塊下的頁面跳轉(zhuǎn)示例

    開始模塊化開發(fā)項目之后，一個很重要的問題就是頁面見的跳轉(zhuǎn)問題，這篇文章主要介紹了Router解決跨模塊下的頁面跳轉(zhuǎn)示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2018-01-01
  • 動態(tài)的綁定事件addEventListener方法的使用

    動態(tài)的綁定事件addEventListener方法的使用

    本文為大家介紹下動態(tài)的綁定事件的方法addEventListener的使用示例，不了解的朋友可以參考下
    2014-01-01
  • 微信小程序button標簽open-type屬性原理解析

    微信小程序button標簽open-type屬性原理解析

    這篇文章主要介紹了微信小程序button標簽open-type屬性原理解析,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
    2020-01-01
  • JS中字符串切割為數(shù)組/數(shù)組拼接為字符串的代碼例子

    JS中字符串切割為數(shù)組/數(shù)組拼接為字符串的代碼例子

    這篇文章主要給大家介紹了關于JS中字符串切割為數(shù)組/數(shù)組拼接為字符串的相關資料,數(shù)組是JavaScript中最強大的數(shù)據(jù)結(jié)構(gòu),我們常常通過將字符串轉(zhuǎn)換為數(shù)組來解決許多算法,需要的朋友可以參考下
    2023-09-09

最新評論