-3

良い一日！

聞きたいことがあります。jqueryでこれらの行を短縮できる方法はありますか? 私は特に if-else 部分を意味します。ありがとうございました！

$("#banner a").bind("click",function(event){//2 

event.preventDefault();

target = $(this).attr("href");

    if(target=="#home"){
               $("#prevID").attr("class","");
               $("#nextID").attr("class","next");
               $("#nextID").attr("href","#home");
               $("#prevID").attr("href","#home");

           }else if(target=="#newsletter"){
                $("#prevID").attr("class","prev");
               $("#nextID").attr("href","#newsletter");
               $("#prevID").attr("href","#newsletter");

           }else if(target=="#directions"){
               $("#prevID").attr("class","prev");
               $("#nextID").attr("href","#directions");
               $("#prevID").attr("href","#directions");

           }else if(target=="#contact"){
               $("#prevID").attr("class","prev");
               $("#nextID").attr("class","");
               $("#nextID").attr("href","#contact");
               $("#prevID").attr("href","#contact");

           }else{}

           $("html, body").stop().animate({
               scrollLeft: $(target).offset().left,
               scrollTop: $(target).offset().top
           }, 1200);
       });//closing 2

       $(".next").bind("click",function(event){//3
           event.preventDefault();
            target = $(this).attr("href");
            if(target=='#home'){
               a='#newsletter';
               $(".next").attr("href","#newsletter");
               $("#prevID").attr("class","prev");
               $("#prevID").attr("href","#newsletter");
           }else if(target=='#newsletter'){
                 a='#directions';
                 $(".next").attr("href","#directions");
                  $("#prevID").attr("href","#directions");
           }else if(target=='#directions'){
                a='#contact';
                 $(".next").attr("href","#contact");
                  $("#prevID").attr("href","#contact");
                $(".next").attr("class","");
           }else{}


           $("html, body").stop().animate({
               scrollLeft: $(a).offset().left,
               scrollTop: $(a).offset().top
           }, 1200);

         // $(".next").attr("href","#");
       });//closing 3

       $("#prevID").bind("click",function(event){//3
           event.preventDefault();
            target = $(this).attr("href");

            if(target=='#newsletter'){
               a='#home';
               $("#prevID").attr("href","#home");
               $(".next").attr("href","#home");
                $("#prevID").attr("class","");
           }else if(target=='#directions'){
                a='#newsletter';
               $("#prevID").attr("href","#newsletter");
               $(".next").attr("href","#newsletter");


           }else if(target=='#contact'){
                a='#directions';
               $("#prevID").attr("href","#directions");
              $("#nextID").attr("class","next");
              $("#nextID").attr("href","#directions");

           }else{}


           $("html, body").stop().animate({
               scrollLeft: $(a).offset().left,
               scrollTop: $(a).offset().top
           }, 1200);

         // $(".next").attr("href","#");
       });//closing 3

    });

見るのはちょっとハッスルに見えます。また、私はまだjqueryを学んでいるので、型にはまらない構文についてお詫び申し上げます。:)

4

1 に答える 1

0

おそらくhttp://codereview.stackexchange.comでこのリクエストに対するより多くの応答を得ることができますが、コードの最初のブロックを簡素化し、複数のif/else ifステートメントの代わりにルックアップ テーブルを使用して多くのコードを繰り返さないようにする方法についてのアイデアを次に示します。

$("#banner a").click(function(event){//2 
    event.preventDefault();
    target = $(this).attr("href");
    var data = {
        // target: [prevID class, nextID class]
        "#home": ["", "next"],
        "#newsletter": ["prev", null],
        "#directions": ["prev", null],
        "#contact": ["prev", ""]
    };
    var item = data[target];
    if (item) {
        $("#nextID").attr("href", target);
        $("#prevID").attr("href", target).attr("class", item[0]);
        if (item[1] !== null) {
            $("#nextID").attr("class", item[1]);
        }
    }

   $("html, body").stop().animate({
       scrollLeft: $(target).offset().left,
       scrollTop: $(target).offset().top
   }, 1200);
});//closing 2
于 2013-04-15T16:34:54.073 に答える