6

http://jsfiddle.net/NzbRQ/2/

ユーザーが複数行のフィールドを追加できるようにしていますが、フィールドの最初の行に削除リンクを含めたくないので、すべてのフィールドを削除することはできません。

また、フィールドを 3 行だけに制限するにはどうすればよいですか?

4

4 に答える 4

5

このフィドルを試してください:フィドル

最初の行の削除を非表示にする最初の部分では、ページの読み込み時に次のように呼び出しました。

$(".removeoutcome").hide();

次に、3つ以上追加したり、最後のものを削除したりできないようにするために、clickメソッドに長さチェックを追加しました。次を参照してください。

$('.addoutcome').live('click', function() {
    if ($(".outcomegroup").length < 3) {
        $('#template').clone().removeAttr('id').insertAfter($(this).closest('.outcomegroup')).find('.minus').show();
        renumber();
    }
});

$('.removeoutcome').live('click', function() {
    if ($(".outcomegroup").length > 1) {
        $(this).closest('.outcomegroup').remove();
        renumber()
    }
});

また、補足として、live現在は非推奨になっているため、jQuery 1.7 を使用している場合はこれらのメソッドを に変更するonか、1.7 より前の場合は を使用してdelegateください。

于 2012-05-17T15:26:23.610 に答える
3

次のコードを使用して、最初の要素の del を非表示にして、さらに 3 つのセットのみを追加するように制限できます。

var count = 3;
$('.minus').first().hide();
$('.addoutcome').live('click', function() {
 count--;
   if(count < 0 )return;  
    $('#template').clone().removeAttr('id').insertAfter($(this).closest('.outcomegroup')).find('.minus').show();

});

ここに作業フィドルがありますhttp://jsfiddle.net/joycse06/uW9NQ/

于 2012-05-17T15:22:18.747 に答える
0

更新: http: //jsfiddle.net/NzbRQ/5/

まず、溝.livesectionより具体的なセレクターを提供するためにを追加しましたbodyが、元のDOMで使用できるより良いものがおそらくあります。

単純なロジックで最後の行を削除しないでください。将来の「del」リンクを表示するためのロジックは、実際にはすでに存在していました。「del」を表示しないだけで十分なので、最終行の削除ロジックはまったく必要ありませんが、私は徹底的に取り組んでいました。

于 2012-05-17T15:21:45.237 に答える
0

なぜ誰もこの行に細心の注意を払っていないのか、私にはわかりません:

.find('.minus').show();

彼は間違いなく要素を非表示にしていましたdel。つまり、適切な CSS ルールを追加するだけで済みます。

.minus { display: none; }

それだけです。最初の要素にはdelリンクが表示されず、他の要素にはリンクが表示されます。

単純に3要素に制限。

$("[parent element]").on('click', '.addoutcome', function() {
  if($('.addoutcome').length > 2) return;    
  ...
});

より良いセレクター[parent selector]が必要であり、レイアウトに完全に依存します。基本的に、これらすべての要素をラップする要素であり、それらすべての親要素です。

于 2012-05-17T15:38:08.397 に答える