1

私が打ったステッププロセスにjqueryスライド（ダウン/アップ）効果を使用しています.IDが選択されていない場合にIDをスライドさせる方法がわかりません 。 

$(function(){
        $('ul.new_checkout li > .title').on('click', function(){
            var id=$(this).attr('id');
            var rep=id.replace(/[^a-z0-9\s]/gi, '').replace(/[_\s]/g, '-');
            console.log("id:" +rep);
            if(rep){
               $("#"+rep).slideDown('fast');
              }
                 })
           });

 <ul class="new_checkout">
    <li>
         <div class="title" id="step-1"> Step-1</div>
     <div class="content" id="step1"></div>
    </li>
 </ul>

他のステップをクリックした場合、ステップ ID をスライドアップするにはどうすればよいですか? 手伝ってください

4

2 に答える 2

1

私はついに私の答えをいじって答えを得ました

ステップショーの前にコンテンツを非表示にします。

$('ul.new_checkout li > .title').on('click', function(){
  var id=$(this).attr('id');
  var rep=id.replace(/[^a-z0-9\s]/gi, '').replace(/[_\s]/g, '-');
  console.log("id:" +rep);
  if(rep){
    $('.content').slideUp('slow');
    $("#"+rep).slideDown('fast');
  }
});
于 2013-12-07T05:55:24.763 に答える
0 
$(function(){
  $('ul.new_checkout li > .title').on('click', function(){
    var id=$(this).attr('id');
    var rep=id.replace(/[^a-z0-9\s]/gi, '').replace(/[_\s]/g, '-');
    console.log("id:" +rep);
    if(rep){
      $(".content").slideUp('fast');
      $("#"+rep).slideDown('fast');
    }
  })
});

<ul class="new_checkout">
  <li>
     <div class="title" id="step-1"> Step-1</div>
     <div class="content" id="step1"></div>
  </li>
 </ul>

これにより、正しい div が下にスライドすると、他の div が上にスライドします。

これが更新されたフィドルです。

于 2013-12-07T05:56:43.133 に答える