0

jQueryには20個の関数があり、divを上下にスライドさせて配置します。

私の質問は：

名前付き関数を使用するようにこのコードを変更するにはどうすればよいですか。名前を付けてコードを 1 つの関数にまとめることはできますか?

$('#top1').click(function() {
      $('#book3').slideDown('slow', function() {
        // Animation complete.
      });
    });
    $('#luk3').click(function() {
      $('#book3').slideUp('slow', function() {
        // Animation complete.
      });
    });

    $('#top2').click(function() {
      $('#book4').slideDown('slow', function() {
        // Animation complete.
      });
    });
    $('#luk4').click(function() {
      $('#book4').slideUp('slow', function() {
        // Animation complete.
      });
    });

私はまだ多くの機能を持っていますが、それらすべてを書くつもりはありません。

<div id="top3">
Opdater Password til absb.dk
</div>
<div id="book5">
    <h5>Updater adgangskode</h5>
    <form action="#" method="post">
    <table>
            <tr>
                <td>Adgangskode</td>
                <td><input type="password" name="pass" class="new"></td>
            </tr>
            <tr>
                <td>Adgangskode gentag</td>
                <td><input type="password" name="gentag" class="new"></td>
            </tr>
            <tr>
                <td><input type="submit" name="opdater_pass" value="Opdater" class="new upload_boxxen"></td>
                <td></td>
            </tr>
        </table>
        <?php
        if(isset($_POST["opdater_pass"]))
        {
            $updater_pass = $mebe->updater_pass();
        }
        ?>
    </form>
    <div id="luk5">
        Luk
    </div>
</div>

これは私のコンテンツの一部です

4

2 に答える 2

0

あなたの質問を正しく理解していると思われる場合は、各 div にクラスを追加し、代わりにクリック関数にそれを見てもらうことができます。

たとえば、次のような div を使用できます。

<div id="top3" class="slider_toggle">Opdater Password til absb.dk</div>

次に、jQuery を更新してそのクラスを使用し、クリックされた div の ID を取得して、その div を好きなようにスライドさせることができます。

$('.slider_toggle').click(function () {
    $(this).slideUp('slow', function () {
        alert("slide is complete");
        // Animation complete.
    });
});

私がどのようにそれを行ったかを見て確認するために、動作する JS フィドルを提供しました: http://jsfiddle.net/BhuKM/

于 2013-04-28T12:15:53.543 に答える
0

IDごとに関数を用意する必要がないように、コードの量を減らすように求めていると思います。

まず、コードを次のように減らすことができます。

$('#top1, #top2, #top3').click(function() {
  $(this).next().slideDown('slow', function() {
    // Animation complete.
  });
});

$('#luk1, #luk2, #luk3').click(function() {
  $(this).parent().slideUp('slow', function() {
    // Animation complete.
  });
});

次に、「top」と「luk」のそれぞれにクラスを与えようとするので、次のように使用できます。

$('.top').click(function() {
  $(this).next().slideDown('slow', function() {
    // Animation complete.
  });
});

$('.luk').click(function() {
  $(this).parent().slideUp('slow', function() {
    // Animation complete.
  });
});
于 2013-04-28T12:19:50.423 に答える