jquery - クリックイベント機能-個別のクリック

Question

http://jsfiddle.net/3eMGR/16/

最初のクリックで行2が表示され、2回目のクリックで行3が表示されるようにしようとしています。

2つの別々のイベントを作成するにはどうすればよいですか？

みんなの助けてくれてありがとう！

Answer 1

同じクリックハンドラーである必要がありますが、変数を使用してクリック数を追跡できます。

var clickTarget = 2;
$("button").click(function () {
  var selector = "." + clickTarget.toString();
  $(selector).css("display","inherit");
  $(selector).show();
  clickTarget++;        
});

デモ

Answer 2

このようなものが機能します：

$("button").click(function () {
  $(".2").show();
  $('button').unbind('click').click(function(){
    $('.3').show();
  });
});

ただし、必要なことを行うためのより良い方法は、行を追加するときに実際にdivを動的に追加することです。これをここに示します。

（ボタンのテキストに従って、実際に行を追加することを想定しています。）

また、id複数の要素の属性の使用を停止します。IDは一意であると想定されています。class要素のセットをスタイリングするために属性を使用します。

Answer 3

ちなみに、クラス名は無効です。-それらはまたは文字で始まる必要があります。それらを修正することをお勧めします。

.hiddenとにかく、各要素のクラスを1つずつ削除するだけです。

$(document).ready(function() {
    $("button").click(function() {
        $(".hidden").first().removeClass('hidden');
    });
});​

デモ： http： //jsfiddle.net/Blender/3eMGR/20/

Answer 4

このフィドルを確認してください。これにより、必要なだけ行が動的に追加されます。

$('button').on('click', function() {
                $row = $('div.row:first').clone();
                $('div.wraper').append($row);
            });