배열을 반복하고 중괄호 안의 텍스트를 바꿉니다

Question

다른 사람이 도울 수 있기를 바란다. 다른 텍스트 상자의 텍스트를 함께 엮은 다음 배열의 개체로 {xxx} 자리 표시자를 대체하려고합니다. 최종 텍스트는 'Text_area_3'으로 출력됩니다.

다음에는 매번 자리 표시자를 교체 할 때마다 한 번에 하나씩 배열을 순환하는 버튼을 클릭 할 수 있기를 원합니다.

여기까지 왔지만 버튼 클릭으로 배열을 순환하려고했습니다.

function concatenate(){ 
    document.getElementById("result1").innerHTML = 
    document.getElementById("text_area_1").value + " " + 
    document.getElementById("text_area_2").value; 

document.getElementById("result2").innerHTML = 
    document.getElementById("text_area_3").value; 
} 
$(document).ready(function(){ 
    var arr = ["One","Two","Three"]; 
    var index = 0; 
    $('#next').click(function(){ 
    index = (index + 1) % arr.length ; 
}); 
}); 

감사

Answer 1

은 JQuery와 $의 .each 기능을 시도 자바 스크립트 배열을 반복합니다. 여기에 문서의 예가 나와 있습니다.

$.each([ 52, 97 ], function(index, value) { 
    alert(index + ": " + value); 
}); 

값이 52, 97 및 인덱스

는 0과 1

Answer 2

OK 그래서, 여기에 버전 2,하지만 꽤 여전히 아니에요 :

<div id="requirement #1"> 
    <h1> Requirement #1</h1> 
    <textarea id="text_area_1"></textarea> 
    <textarea id="text_area_2"></textarea></div> 
     <textarea id="text_area_3"></textarea> 
    <button type="button" id="button1" onclick="concatenate()">concatenate</button> 
<p id="result1"></p> 
<p id="result2"></p> 
<div> 
<span id='keyword'></span> 
</div> 
<p></p> 
<button id='next'>Next</button> 


function concatenate(){ 
    document.getElementById("result1").innerHTML = 
    document.getElementById("text_area_1").value + " " + 
    document.getElementById("text_area_2").value; 

document.getElementById("result2").innerHTML = 
    document.getElementById("text_area_3").value; 
} 
var f = ['keyword']; 
var r = ['Road','Street','Avenue']; 

var re = $.map(f, function(v,i) { 
    return new RegExp('\\b' + v + '\\b', 'g'); 
}); 
jQuery('#result2').val(function(i,val) { 
    $.each(f,function(i,v) { 
     val = val.replace(re[i],r[i]); 
    }); 
    return val; 
}); 
$(document).ready(function(){ 
    var arr = r; 
    var index = 0; 
    $('#next').click(function(){ 
    $('#keyword').html(arr[index]); 
    index = (index + 1) % arr.length ; 
}); 
});