2016-07-05 3 views
0

문제를 해결하는 데 어려움이 있습니다. 사각형 이모티콘으로 그리드를 만들어야합니다. 11 개의 정사각형과 68 개의 행. 나는 그것을 창조했다. 이제 내 문제는 행의 특정 행과 위치에있는 정사각형을 타겟팅하고 다른 이모티콘으로 바꾸는 것입니다. .emoji-generator 클래스는 textarea 요소입니다. 나는 그것을 덧붙이려고 노력했다. 그리고 그것은 트릭을하는 것처럼 보인다. 하지만 사각형을 다른 이모티콘으로 바꾸고 줄에 추가하지 않아야합니다. 각 행에는 11 개의 문자 만있을 수 있습니다. 이것에 대해 가장 좋은 방법은 무엇입니까?텍스트를 선택하고 for 루프를 대체하십시오.

var SQUARE_EMOJI = '\u25FB\uFE0F '; 
var DROPLET_EMOJI = '\ud83d\udca7'; 

function reset() { 
    for (var i = 1; i<=68; i++) { 
     for(var y = 0; y <11; y++) { 
      $('.emoji-generator').append(SQUARE_EMOJI); 
      if (i == 6 && y == 5) { 
       $('.emoji-generator')[y].append(DROPLET_EMOJI); 
      } 
     } 
     $('.emoji-generator').append('\r\n'); 
    } 
}; 

답변

2

textarea 원소 함량은 노드를 삽입 향하는 append되는 방법에 의해 조작되지 않는다. 대신 내용을 설정하는 방법으로 val을 사용해야합니다. 그리고 성능을 향상 시키려면 함수 끝에 한 번만하는 것이 가장 좋습니다.

var SQUARE_EMOJI = '\u25FB\uFE0F '; 
var DROPLET_EMOJI = '\ud83d\udca7'; 

function reset() { 
    var content = ''; 
    for (var i = 1; i<=68; i++) { 
     for(var y = 0; y <11; y++) { 
      if (i == 6 && y == 5) { 
       content += DROPLET_EMOJI; 
      } else { 
       content += SQUARE_EMOJI; 
      } 
     } 
     content += '\n'; 
    } 
    $('.emoji-generator').val(content); 
};