jqueryでカウンタを作成する方法

-3

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 

<script src="../plugin/jquery-1.6.1.min.js"></script> 
<script src="../plugin/jquery.validate.min.js"></script> 
<script src="../plugin/jquery.form.js"></script> 
<link rel="stylesheet" type="text/css" href="../style/form.css" /> 
<script> 
$(document).ready(function() { 
    $("#add").click(function() { 
     var id = "input" + $(this).attr("id").replace("field",""); 
     var intId = $("#buildyourform div").length + 1; 
     var fieldWrapper = $("<div class=\"fieldwrapper\" id=\"field" + intId + "\"/>"); 
     var fName = $("<input type=\"text\" id=\"" + id + "\" name=\"" + id + "\" class=\"fieldname\" />"); 
     var fType = $("<select class=\"fieldtype\"><option value=\"checkbox\">Checked</option><option value=\"textbox\">Text</option><option value=\"textarea\">Paragraph</option></select>"); 
     var removeButton = $("<input type=\"button\" class=\"remove\" value=\"-\" />"); 
     removeButton.click(function() { 
      $(this).parent().remove(); 
     }); 
     fieldWrapper.append(fName); 
     fieldWrapper.append(fType); 
     fieldWrapper.append(removeButton); 
     $("#buildyourform").append(fieldWrapper); 
    }); 
}); 

</script> 


</head> 
<body> 
<div id="stylized" class="myform"> 
<form id="edit" method="post" action="config.php" > 
<fieldset id="buildyourform"> 
    <legend>Build your own form!</legend> 
</fieldset> 
<input type="button" value="Add a field" class="add" id="add" /> 
<input type="submit"> 
<div class="spacer"></div> 

</form> 
</body> 
</html>

これは動的フォームのコードですが、現在、テキストボックス名と選択ボックス名は「inputadd」です。これをinput1、input2、input3に変更しますつまり、ユーザーがフィールドを追加すると、counter + 1となり、テキストフィールドの名前、選択フィールドがその文字列になり、カウンタ-1を削除すると同じことを意味します。これを達成するためにコードを変更するにはどうすればよいですか？ありがとうjqueryでカウンタを作成する方法

出典

2012-03-12 user782104

JavaScriptの文字列には二重引用符（ "）を使用することをお勧めしますコードはわかりやすくなります –

文字列は' '' ' – Will

それは逆に働く。二重引用符の中から一重引用符をエスケープする必要はありません。また、なぜ誰かがこの質問が-3に座っている理由を明確に説明することができますか？一般的に、もしあなたが誰かにdownvoteするつもりなら、彼らが* why *を知っていることを確認する価値があるようです。 –

（ちょうどあなたがアルファベット文字を前に付けなければならない、そのIDは数字で始めることはできません覚えている）

$(document).ready(function() { 
    $("#add").click(function() { 
     var id = $('#buildyourform .fieldwrapper').size(); 
    }); 
});

の代わりに：そこに「#buildyourform」（望ましい）でありますinput1、input2、input3、...

<form id="your-form"> 
    <li><input type="text" name="input[]" /></li> 
    <li><input type="text" name="input[]" /></li> 
    <li><input type="text" name="input[]" /></li> 
    <li><input type="text" name="input[]" /></li> 
    <li><input type="text" name="input[]" /></li> 
    <li><input type="text" name="input[]" /></li> 
    <input type="submit" /> 
</form>

これはPHPで、たとえば、すべてのinput[]要素の配列としてあなたにPOSTフィールドのデータを与える必要があります：

foreach ($_POST['input'] as $input) { 
    echo $input . PHP_EOL; 
}

JavaScriptでカウントする必要はありません。name="input[]"という別のフィールドを追加するだけで済みます。

出典

2012-03-12 19:09:55 joar

ありがとうございます、どうすれば文字列を追加できますか？各入力ボックスの前に名前を入力してください。 – user782104

二つの方法 - グローバル変数を持つ：

int formcount = 0; 

$(document).ready(function() { 
    $("#add").click(function() { 
     var id = formcount++; 
    }); 
});

OR 'fieldwrapper' クラスとどのように多くの要素を数えますinput[]は、あなたが使用する必要があります

出典

2012-03-12 19:02:12 Andre

あなたはたぶん '.count（）'の代わりに '.length'を意味していました。 – gdoron

@gdoron正確には、私は[サイズ]（http://api.jquery.com/size/）を意味しました。 – Andre

_ ".size（）メソッドは機能的には.lengthプロパティと同等ですが、関数呼び出しのオーバーヘッドがないため、.lengthプロパティが優先されます。" _ – gdoron

jqueryでカウンタを作成する方法

答えて

関連する問題