使用jQuery動態查找和顯示特定的部分？

我有一個包含相似類的多個實例的列。類爲refHeader1，refHeader2，refHeader3和ref1select，ref2select，ref3select和refScen1，refScen2，refScen3。以下，這些數字正在被@ {@ i}替代以動態驅動。我需要的是點擊（this）ref @ {@ i}選擇時，顯示最接近的refScen @ {@ i}跨度，並且refScen @ {@ i}跨度的所有其餘部分都被隱藏。到目前爲止，我已經嘗試了下面的jQuery，但沒有運氣。我究竟做錯了什麼？在控制檯中，當我試圖找到最接近的時候，我只是空的[]括號。提前致謝。 http://jsbin.com/ezODiTAV/1/edit 使用jQuery動態查找和顯示特定的部分？

jQuery的

$("span[class*=select]").click(function() { 
     // first hide all refScen spans 
     $('span[class^=refScen]').hide(); 

     // show this refScen span 
     //$(this).closest('span[class^=refScen]').show(); 
     //$(this).find().closest('span[class^=refScen]').show(); 
     //$(this).find().next('span[class^=refScen]').show(); 
});

HTML

<div class="col-md-12 padT nPadL nPadR" style="padding-bottom:10px"> 
    <span class='[email protected]{@i}'> 
     <a href="#"><label>@item.Name</label></a> 
     <div class="glyphicon glyphicon-chevron-down text-right [email protected]{@i}select"></div> 
    </span> 
</div> 
<!-- /left options -->    
<span class='[email protected]{@i}'> 
     <div class="col-md-9 col-md-offset-3 padB nPadL nPadR"> 
      <a href="#">@listitem.Name</a> 
     </div> 
</span>

來源

2013-12-18 triplethreat77

我沒有看到任何含有術語'select'的類的跨度，我看到一個div –

嘗試http://jsfiddle.net/arunpjohny/6MA9X/5/ –

問題是refScen**不是[email protected]{@i}select元素的祖先，這是它的祖先元素之一

$("div[class*=select]").click(function() { 
    $('span[class^="refScen"]').hide(); 
    $(this).closest('.col-md-12').next().show(); 
    //or $(this).parent().parent().next().show(); 
});

演示下一個兄弟：Fiddle

做簡單得多，爲什麼你不能添加一個多個類，以這些元素的無數等

<div class="col-md-12 padT nPadL nPadR" style="padding-bottom:10px"> 
    <span class='[email protected]{@i} refHeaderrefHeader'> 
     <a href="#"><label>@item.Name</label></a> 
     <div class="glyphicon glyphicon-chevron-down text-right [email protected]{@i}select rfselect"></div> 
    </span> 
</div> 
<!-- /left options -->    
<span class='[email protected]{@i} refScen'> 
     <div class="col-md-9 col-md-offset-3 padB nPadL nPadR"> 
      <a href="#">@listitem.Name</a> 
     </div> 
</span>

然後

$(".rfselect").click(function() { 
    $('.rfselect').hide(); 
    $(this).closest('.col-md-12').next().show(); 
    //or $(this).parent().parent().next().show(); 
});

來源

2013-12-18 16:06:20

以上用jsbin示例更新了問題。仍然無法得到這個工作。 – triplethreat77

看起來像'refScen3'在'refScen2'裏面是期望的行爲... –

@ triplethreat77它也不是'$（「span [class * = select]」），它是'$（「div [class * =選擇]「）。' –

你錯過一些'和"試試這個：

$("span[class*='select']").click(function() { 
     // first hide all refScen spans 
     $('span[class^="refScen"]').hide(); 

     $(this).closest('.col-md-12').next().show() 
});

來源

2013-12-18 16:06:03

使用jQuery動態查找和顯示特定的部分？

回答

相關問題