2017-03-01 11 views
0

アイテムのリストがあります。私は 'アクティブ'クラスのノードIDを持っています。 アクティブフレックスnode_idを取得し、アクティブリストアイテムを中央の位置にプルしたいとします。私は、リストアイテムクラスとactive_slide node_idを一致させ、アイテムを中心位置に引っ張りたい。アクティブリストノードの項目を2番目の位置にプル

例:233は 'active_slide'です。私はあなたがすでに再ため、その後eachから取得し、あなたがitem要素を使用することができます69233299

jQuery(document).ready(function($){ 
 
setTimeout(function(){ 
 
var node_id = $('.flex-active-slide .node_id').text(); 
 
    $('.thumbnailIcon').each(function(index, item){ 
 
    \t $('.'+node_id+'li:eq(1)').before($('.thumbnailIcon li:eq(2)')); 
 
    }); 
 
},1000); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li class="parent flex-active-slide"> 
 
    <div class="node_id"><span>233</span></div> 
 
    <ul class="thumbnailIcon"> 
 
     <li>left</li> 
 
     <li class="233">1</li> 
 
     <li class="69">2</li> 
 
     
 
     <li class="299">3</li> 
 
     <li>right</li> 
 
    </ul> 
 
</li> 
 
<li class="parent"> 
 
    <div class="node_id"><span>222</span></div> 
 
    <ul class="thumbnailIcon"> 
 
     <li>left</li> 
 
     <li class="233">1</li> 
 
     <li class="69">2</li> 
 
     <li class="299">3</li> 
 
     <li>right</li> 
 
    </ul> 
 
</li> 
 
<a href="#" class="flex-next">click<a> 
 
<li class="parent"> 
 
    <div class="node_id"><span>333</span></div> 
 
    <ul class="thumbnailIcon"> 
 
     <li>left</li> 
 
     <li class="233">1</li> 
 
     <li class="69">2</li> 
 
     
 
     <li class="299">3</li> 
 
     <li>right</li> 
 
    </ul> 
 
</li>

+0

は '$に欠けているスペースがない(+ NODE_ID + '李:EQ(1) ''。')' '李前:EQ(1)'? – gus27

+0

あなたはフィドルを提供できますか? – user3386779

答えて

1

のように中央の位置に項目をNODE_IDを比較し、リスト項目を引くとプルしたいですliinsertAfterによって:

jQuery(document).ready(function($){ 
 
    setTimeout(function(){ 
 
     var node_id = $('.flex-active-slide .node_id').text(); 
 
     $('.thumbnailIcon').each(function(index, item){ 
 
     $(item).find('.'+node_id).insertAfter($(item).find('li:eq(2)')); 
 
     }); 
 
    },1000); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li class="parent flex-active-slide"> 
 
    <div class="node_id"><span>233</span></div> 
 
    <ul class="thumbnailIcon"> 
 
     <li>left</li> 
 
     <li class="233">1</li> 
 
     <li class="69">2</li> 
 
     <li class="299">3</li> 
 
     <li>right</li> 
 
    </ul> 
 
</li> 
 
<li class="parent"> 
 
    <div class="node_id"><span>222</span></div> 
 
    <ul class="thumbnailIcon"> 
 
     <li>left</li> 
 
     <li class="233">1</li> 
 
     <li class="69">2</li> 
 
     <li class="299">3</li> 
 
     <li>right</li> 
 
    </ul> 
 
</li> 
 
<a href="#" class="flex-next">click<a> 
 
<li class="parent"> 
 
    <div class="node_id"><span>333</span></div> 
 
    <ul class="thumbnailIcon"> 
 
     <li>left</li> 
 
     <li class="233">1</li> 
 
     <li class="69">2</li> 
 
     <li class="299">3</li> 
 
     <li>right</li> 
 
    </ul> 
 
</li>

はここにフィドルを参照してください。

関連する問題