jQueryの、インクリメントIDを動的に追加する要素は値

Question

var counter = 0; 
 

 
$(document).ready(function() { 
 
    $("#container").append('<div class="row ' + counter + '"><div class="form-horizontal ' + counter + '"><div class="form-group col-md-12 col-xs-12"><div class="col-md-4 col-xs-6"><input id="txtfname' + counter + '" class="form-control" type="text" placeholder="First Name"></div><div class="col-md-4 col-xs-6"><input id="txtlname' + counter + '" class="form-control" type="text" placeholder="Last Name"></div><div class="col-md-4 col-xs-6"><input id="textaddress' + counter + '" class="form-control" type="text" placeholder="Address"></div></div></div></div>'); 
 
    counter++; 
 
    return false; 
 

 
}) 
 

 
$(document).on('click', '#add', function() 
 
{ 
 
    if(counter > 0){ 
 
     var inputName = $('#txtfname' + counter).val(); 
 

 
     debugger; 
 
     // var ele = $(jQuery.trim('#txtfname'+counter.toString())).val(); 
 
     // var name = inputName.valueOf() 
 

 
     if (jQuery.trim(inputName).length > 0) 
 
     { 
 
      $(ele).prop('disabled', true); 
 
      
 
      alert("First name filled"); 
 
     } 
 
     else 
 
     { 
 
      alert("Nothing Filled"); 
 
     } 
 
} 
 
    
 
    $("#container").append('<div class="row ' + counter + '"><div class="form-horizontal ' + counter + '"><div class="form-group col-md-12 col-xs-12"><div class="col-md-4 col-xs-6"><input id="txtfname' + counter + '" class="form-control" type="text" placeholder="First Name"></div><div class="col-md-4 col-xs-6"><input id="txtlname' + counter + '" class="form-control" type="text" placeholder="Last Name"></div><div class="col-md-4 col-xs-6"><input id="textaddress' + counter + '" class="form-control" type="text" placeholder="Address"></div></div></div></div>'); 
 
    counter++; 
 
    return false; 
 

 
}); 
 

 
$("#remove").click(function() { 
 
    if (counter == 1) { 
 
     alert("No more author to remove"); 
 
     return false; 
 
    } 
 

 
    counter--; 
 

 
    // $(".row" + counter).remove(); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" 
 
     ></script> 
 
<div id="container"> 
 
</div> 
 

 
<div>  
 
    <input type="button" id="add" value="Add input Row"/> 
 
    <input type="button" id="remove" value="Remove input Row"/> 
 
    
 
</div>

を得ることができない場合

私が入力された値を取得したい

var inputName = $('#txtfname' + counter).val(); // inputName= '#txtfname1' 

例えばval()機能 を用いdivから値を取得することはできませんtxtfnameフィールドにありますが、私はそれを得ることができませんでした 助けてください

This is my code in html view

var counter = 1; 

$(document).on('click', '#add', function() 
{ 
    if(counter > 0){ 
     var inputName = $('#txtfname' + counter).val(); 

     if (jQuery.trim(inputName).length > 0) { 
      $(inputName).prop('disabled', true); 
      alert("First name filled"); 
     } else { 
      alert("something else"); 
    } 
} 

// debugger; 
$("#container").append('<div class="row ' + counter + '"><div class="form-horizontal ' + counter + '"><div class="form-group col-md-12 col-xs-12"><div class="col-md-4 col-xs-6"><input id="txtfname' + counter + '" class="form-control" type="text" placeholder="First Name"></div><div class="col-md-4 col-xs-6"><input id="txtlname' + counter + '" class="form-control" type="text" placeholder="Last Name"></div><div class="col-md-4 col-xs-6"><input id="textaddress' + counter + '" class="form-control" type="text" placeholder="Address"></div></div></div></div>'); 
    counter++; 
    return false; 

}); 

Answer 1

は、あなたのHTMLが正しく生成された場合に検査するためにあなたのブラウザドムエクスプローラ（開発者に対しツール）を使用して試してみて、あなたの入力は本当にあなたがするつもりIDセットを持っていましたか？

Answer 2

あなたは実際に、val()とDIVのコンテンツを取得