동일한 이름의 양식 입력 받기

Question

<form id="file-upload"> 
    <input type="text" name="title[]" placeholder="Title"> 
    <input type="text" name="alt[]" placeholder="Alt"> 
    <input type="text" name="keywords[]" placeholder="Keywords"> 

    <input type="text" name="title[]" placeholder="Title"> 
    <input type="text" name="alt[]" placeholder="Alt"> 
    <input type="text" name="keywords[]" placeholder="Keywords"> 
    //etc 
</form> 

양식의 이름이 같은 필드가 여러 개 있습니다.

JS에서 양식을 실행하고 제목, 키워드 및 alt 값을 가져 와서 양식 데이터 객체에 추가하려면 formData 객체에 이미지를 추가하고 이미지와 메타 데이터 서버를 함께 저장합니다. 측면.

제 문제는 양식 입력 값 가져 오기에 관한 것입니다. 양식을 seralize하거나 dom 요소를 통해 루프하는 것이 가장 좋습니다. 어떻게해야합니까?

은 그래서 필요 :

1. 첫 타이틀, 고도, 키워드 필드를 얻기 - 어떻게?
2. formData에 추가하고 파일을 보내고 서버로 전송 -이 작업을 수행 할 수 있습니다.
3. 두 번째 제목, alt, keywords 필드 가져 오기 - 방법?
4. formData에 추가하고 파일을 보내고 서버로 전송 -이 작업을 수행 할 수 있습니다.

등등 ...

Answer 1

document.getElementsByName("title[]"); 일치하는 모든 요소의 배열을 반환한다. 그런 다음 첫 번째, 두 번째 등을 색인으로 가져옵니다.

document.getElementsByName("title[]")[0]; // first title 

jQuery를에

https://developer.mozilla.org/en-US/docs/Web/API/document.getElementsByName

이 잘 작동합니다 :

var firstTitle = $("[name='title[]']")[0].value; 

당신은 확실히 선택기 캐시해야하지만 :

var titles = $("[name='title[]']"); 
var firstTitle = titles[0].value; 
var secondTitle = titles[1].value; 

Answer 2

내가 뒷조사를했고,이 바이올린을 생성합니다. 희망이 도움이됩니다.

var values = $("input[name='title\\[\\]']").map(function(){return $(this).val();}).get(); 

$("<div>title[0]:"+values[0]+"</div>").appendTo('#results'); 
$("<div>title[1]:"+values[1]+"</div>").appendTo('#results'); 
$("<div>title[2]:"+values[2]+"</div>").appendTo('#results'); 

http://jsfiddle.net/y5n8A/

Answer 3

http://api.jquery.com/jquery.map/

시도가 (지도) 기능을 사용하려면,이 배열