JQUERY에서 변경시 첨부 된 텍스트 상자의 값 가져 오기

Question

도움이 필요합니다.

동일한 클래스 이름을 가진 추가 된 텍스트 상자의 값을 어떻게 얻을 수 있습니까? 친절하게 코드 스 니펫을 찾으십시오.

JS는 :

var count = document.getElementsByName("emailId[]").length; //get the totol no. of contact no. elements 
//function to add a new element for entering emailId 
$("#add-email-id").click(function() { 
    $("#email-id-container").append('<div id="emailAddress_container_' + count + '" style="margin-top:8px"><input type="text" name="emailId[]" id="email_address_' + count + '" data-toggle="tooltip" title="Enter Email address here" placeholder="example@example.com" size="30" onBlur="ValidateEmail(' + count + ');" class="emailId"><span><input class="username" id="username_' + count + '" name="username[]" value="username" /></span><span style="margin-left:8px;"><a href="javascript:void(0);" class="delete-email-id" style="color:#F00;">(-)</a></span><span id="email_err_' + count + '"></span></div>'); 
    count++; //increment the counter as new contact element is being added. 
}); 

$(document).ready(function() { 
    $('.emailId').change(function() { 
     var usernameDiv = $(this).parent("div").find(".username").attr("id"); //get the div where the truncated username will be placed 
     alert($(this).attr("id")); 
     alert($("#" + usernameDiv).val()); 
     var emailAddress = $(this).val(); 
     var truncatedValue = emailAddress; 
     var name = ""; 
     if (emailAddress.indexOf("@") != -1) { 
      ///alert("@");  
      name = $.trim(emailAddress.split("@")[0]); 
      //alert(name); 
      if (name && name.search(/\s/) === -1) { 
       var len = name.length; 
       //alert(len); 
       if (len > 4) { 
        truncatedValue = name.substring(0, 3); 
       } 
       usernameDiv.val(truncatedValue); 
      } else { 
       usernameDiv.val("username"); 
      } 
     } 
    }); 
}); 

나는 EMAIL_ADDRESS 필드의 값을 가져온 다음 추가 적절한 사용자 이름 필드에 잘린 값을 얻을 필요가있다.

Answer 1

$('.emailId').change(function() { //will not work for dynamic generated element 

변경

$(document).on('change', '.emailId', function() { 

에 위의 코드 라인 대신 문서에 이벤트 핸들러에 첨부 또는 요소가 생성 될 때 .change 이벤트를 호출해야합니다.