페이지에 같은 이름의 입력란을 여러 개 가져 오는 방법은 무엇입니까?

Question

나는 웹 페이지를 만들고있다. 그것은 하나의 섹션으로 그룹화 된 일부 입력 필드를 가지고 있으며 그 섹션 아래에는 "다른 추가"버튼이 있습니다. 이 버튼은 JavaScript를 사용하여 페이지에 또 다른 동일한 섹션을 추가합니다. 같은 양식 필드.

그런 다음 나중에 페이지에 '계산'버튼이 있습니다. 그것은 jQuery를 통해 이러한 입력 필드에 액세스해야하는 다른 JavaScript를 실행합니다.

페이지에 여러 개의 input 요소가 중복되는 것이 좋습니다. 동일한 ID를 가진 두 개의 요소가 없어야한다는 것을 알고 있지만 같은 이름의 두 요소는 어떻게됩니까? 개별적으로 액세스 할 수 있습니까? 또는 이러한 입력 요소의 이름을 JavaScript와 다르게 지정해야합니까? 예 : 그들의 이름의 끝에 "1", "2"등을 추가 한 다음 루프를 사용합니까? (지저분 해 보인다)

이러한 입력 필드 그룹을 어떻게 식별하고 액세스해야합니까?

Answer 1

document.getElementsByName('name')을 사용하고 결과를 반복하여 각 값을 얻을 수 있습니다.

Answer 2

서로 다른 id이 있으면 문제없이 동일한 이름을 가질 수 있습니다.

제출할 때 서버는 반복되는 이름/값 쌍을 얻게되며이를 처리 할 때이를 인식해야합니다. 다른 언어는 어떻게 다른지, 당신이 사용하고있는 무엇이든 그것을하는 방법에 대한 적절한 문서를 참조해야합니다.

Answer 3

페이지에 input 개의 중복 된 요소를 포함하는 것이 좋은 방법은 무엇입니까?

그냥 해보세요.

같은 ID를 가진 요소가 두 개 있으면 안되지만 동일한 이름의 두 요소는 어떻게됩니까?

JS로 이름에 액세스하는 데 사용할 수있는 모든 방법은 요소 대신 모음을 제공합니다. 배열과 마찬가지로 개별 요소에 액세스 할 수 있습니다 (for 및 collection.length으로 반복 포함).

개별적으로 액세스 할 수 있습니까?

이름으로 액세스하는 경우 해당 색인을 사용할 수 있습니다. (collection[0]).

특정 ID에 액세스하려면 해당 ID를 제공 할 수도 있습니다.

요소를 서로 연결하고 서로 참조하려는 경우 DOM 구조를 사용하여 도움을받을 수 있습니다. 아주 간단한 예를 들어

:

분명히

<div> 
    <input> 
    <button onclick="alert(this.parentNode.getElementsByTagName('input')[0]);">...</button> 
</div> 

, 실제 상황에서 당신은 unobtrusive JS 및 build on things that work를 사용해야합니다.

Answer 4

당신은 배열
전으로 이름을 지정할 수 있습니다 :

<input type="text" name="textBox[]"/> 

당신은 버튼 "또 다른 추가"를 클릭에서 같은 양식을 추가 할 수 있습니다. 텍스트 상자 [0], 텍스트 상자 [1] 등을 사용하여 액세스 할 수 있습니다.