形式

Question

領域和最小的jQuery的最大值我是新的jQuery點點，所以我有一些問題：

我有2個鏈接，您可以添加1場和刪除1場的形式。

1. 但問題是，我要停留在10場，所以你最大可以添加10個字段？

2. 第二個問題是，它如何停止在最小1字段，現在它是刪除每個字段爲0，如果你點擊刪除所有的時間？

3. 最後一個問題我該怎麼做，所以當我按下提交按鈕時，我想記住你按下提交之前有多少個字段？

我希望有人能幫助我，這件事情我真的需要快速:-D

的jQuery：

var i = $('input').size() + 1; 
max = 10; 

$('#add').click(function() { 
    $('<div><input type="text" class="field" name="dynamic[]" value="Some text..." /></div>').fadeIn('slow').appendTo('.inputs'); 
    i++; 
}); 

$('#remove').click(function() { 
if(i > 1) { 
    $('.field:last').remove(); 
    i--; 
} 
}); 

HTML：

<a href="#" id="add">Add +1</a> | <a href="#" id="remove">Remove -1</a> 
<form method="post"> 
    <div class="inputs"> 
     <div> 
      <input type="text" name="dynamic[]" class="field" value="Some text..."/></div> 
     </div> 
    <input name="submit" type="submit" class="submit" value="Submit"/> 
</form> 

Answer 1

您可以使用$('.field').length來獲得類'字段'的元素數量（更具體的類名可以幫助這裏）。因此，如果您僅將該類用於輸入，則可以將其用作固定計數。

if ($('.field').length <= 10) { 
    //Add a new one 
} else { 
    //Already 10 
} 

Answer 2

$('#add').click(function() { 
    if ($('.field').length <= 10) { 
    $('<div><input type="text" class="field" name="dynamic[]" value="Some text..." /></div>').fadeIn('slow').appendTo('.inputs'); 
    i++; 
}else 
    alert("10 Completed"); 
}); 

$('#remove').click(function() { 
    if ($('.field').length < 1) { 
    $('.field:last').remove(); 
    i--; 
    }else 
    alert("only one"); 
}); 

Answer 3

作爲其他兩個asnwers礦是一樣的。設置一個小提琴：

http://fiddle.jshell.net/Aq7rS/

var i = $('input').size() + 1; 
max = 10; 

$('#add').click(function() { 

if($('.field').length < 11){ 
    $('<div><input type="text" class="field" name="dynamic[]" value="Some text..." /></div>').fadeIn('slow').appendTo('.inputs'); 
     i++; 
    } 

}); 

$('#remove').click(function() { 
    if($('.field').length > 1){ 
     if(i > 1) { 
      $('.field:last').remove(); 
      i--; 
     } 

    } 
});