有關(guān)jQuery中parent()和siblings()的小問題
今天發(fā)現(xiàn)一個小問題,現(xiàn)在也不知道到底是哪個梗在作祟,但是感覺是parent()和siblings()其中的一個。
我是想這樣的根據(jù)輸入的條件刪選內(nèi)容:
demo:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="http://code.jquery.com/jquery-latest.js"></script> <link rel="stylesheet"> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"> <script> $(function(){ var coding = "CODING"; var coding=coding.toUpperCase(); $(".bolSearch").hide().filter(".bolSearch:contains("+coding+")").show().parent().parent().siblings().hide(); }) </script> </head> <body> <div class="weui_cells weui_cells_access search_show" id="search_show" style="diplay:none;"> <div class="weui_cell "> <div class="weui_cell_bd weui_cell_primary"> <a class="qy_color bolSearch">CODING</a> </div> </div> <div class="weui_cell bolSearch"> <div class="weui_cell_bd weui_cell_primary"> <a class="qy_color bolSearch" >WW11JS0261</a> </div> </div> <div class="weui_cell "> <div class="weui_cell_bd weui_cell_primary"> <a class="qy_color bolSearch" >OTHER</a> </div> </div> <div class="weui_cell "> <div class="weui_cell_bd weui_cell_primary"> <a class="qy_color bolSearch" >LITER</a> </div> </div> <div class="weui_cell "> <div class="weui_cell_bd weui_cell_primary"> <a class="qy_color bolSearch" >POST</a> </div> </div> <div class="weui_cell"> <div class="weui_cell_bd weui_cell_primary"> <a class="qy_color bolSearch" >WW11JM042222</a> </div> </div> <div class="weui_cell"> <div class="weui_cell_bd weui_cell_primary"> <a class="qy_color bolSearch">WW11JM031855</a> </div> </div> </div> </body> </html>
上面這個沒問題:
搜索條件為存在:“COIDNG”(如下)的內(nèi)容,在瀏覽器里也結(jié)結(jié)實實的展現(xiàn)出來了。
<script> $(function(){ var coding = "CODING"; var coding=coding.toUpperCase(); $(".bolSearch").hide().filter(".bolSearch:contains("+coding+")").show().parent().parent().siblings().hide(); }) </script>
但是,我把條件改為WW11時(如下),按我自己理解來講,屬于WW11的最后2個內(nèi)容應(yīng)該顯示出來,但是什么都不出來?神馬情況?
<script> $(function(){ var coding = "WW11"; var coding=coding.toUpperCase(); $(".bolSearch").hide().filter(".bolSearch:contains("+coding+")").show().parent().parent().siblings().hide(); }) </script>
接著,再改搜索條件,把WW11改為WW11JM031也就是說這個條件是唯一的,不重復(fù)的。
沒事了,選取的條件可以再次顯示出來了。
接著,我又把條件WW11JM031改回WW11,同時
$(".bolSearch").hide().filter(".bolSearch:contains("+coding+")").show().parent().parent().siblings().hide();
改為
$(".bolSearch").hide().filter(".bolSearch:contains("+coding+")").show();
就達到我想顯示出來的所有內(nèi)容了。雖然內(nèi)容滿足了,但是顯示又不滿足我的要求了。
最后還是繞了一路,把樣式改了。
但是這個梗還是沒繞過去,不明白為什么只能篩選出唯一的條件。
- jquery siblings獲取同輩元素用法實例分析
- jQuery中的siblings()是什么意思(推薦)
- 淺談jquery中next與siblings的區(qū)別
- jQuery siblings()用法實例詳解
- jquery遍歷函數(shù)siblings()用法實例
- jQuery中的siblings用法實例分析
- jQuery中siblings()方法用法實例
- jquery next nextAll nextUntil siblings的區(qū)別介紹
- jQuery prev ~ siblings選擇器使用介紹
- jquery 層次選擇器siblings與nextAll的區(qū)別介紹
- 仿jQuery的siblings效果的js代碼
- jQuery使用siblings獲取某元素所有同輩(兄弟姐妹)元素用法示例
相關(guān)文章
jQuery 獲取、設(shè)置HTML或TEXT內(nèi)容的兩種方法
這篇文章主要介紹了jQuery 獲取、設(shè)置HTML或TEXT內(nèi)容的兩種方法,需要的朋友可以參考下2014-05-05jquery的ajax提交form表單的兩種方法小結(jié)(推薦)
下面小編就為大家?guī)硪黄猨query的ajax提交form表單的兩種方法小結(jié)(推薦)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考2016-05-05完美解決jQuery 鼠標(biāo)快速滑過后,會執(zhí)行多次滑出的問題
下面小編就為大家?guī)硪黄昝澜鉀QjQuery 鼠標(biāo)快速滑過后,會執(zhí)行多次滑出的問題。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-12-12jquery查找父元素、子元素(個人經(jīng)驗總結(jié))
對使用js或者jquery查找父元素、子元素比較混淆的朋友可以參考下本文,因為是個人總結(jié),用起來會比較方便2014-04-04