divs from textarea

특정 클래스가있는 모든 div의 텍스트를 같은 페이지의 텍스트 영역으로 전송하고 싶습니다.divs from textarea

어떻게하면됩니까? 예를 들어

< div class="test1" > Example1 < /div > 
< div class="test2" > Example2 < /div > 
< div class="test1" > Example3 < /div > 
< div class="test3" > Example4 < /div >

나는 "예 1"과 "예 3"을 표시해야합니다 DIV 클래스 TEST1 와 텍스트 영역에서 콘텐츠를 전송하고 싶습니다.

도와주세요. 자바 스크립트 나 PHP

존

출처

2009-11-02 John

이 jQuery를 꽤 쉽게 할 것이다 :

var newTextVal = ""; 
$('.text1').each(
    function() 
    { 
     newTextVal += $(this).text(); 
    } 
); 
$('textarea').val(newTextVal);

및 추가가 텍스트에 텍스트 노드 값의 클래스 "텍스트 1"각각의 요소를 통해이 위의 의지 루프 텍스트 영역 내에서.

출처

2009-11-02 23:39:37

개선 될 수있는 것처럼 보입니다. 문자열이나 문자열 배열에 값을 저장하고 텍스트 영역 값을 루프에서 매번 재 할당하지 말고 끝에 설정하는 것이 좋습니다. –

절대적으로 동의합니다. 나는 맞게 수정했습니다 :) –

클래스 대신 div에 "id"속성을 사용하는 것이 좋습니다. 기본적으로 GetElementById() 또는 GetElementByObject()를 사용하는 JavaScript 함수를 작성해야합니다.

그런 다음 해당 함수를 호출하는 버튼을 정의하여 div의 ID와 텍스트 영역의 ID를 전달하십시오. 마지막으로, textarea 객체의 값을 div 객체의 값으로 설정합니다.

편집 : 다음은 기능입니다. 행사에

<script type="text/javascript"> 
function copyValues(idFrom, idTo) { 
    var objFrom = document.getElementById(idFrom); 
    var objTo = document.getElementById(idTo); 

    objTo.value = objFrom.value 
} 
</script>

당신은 그것을 트리거합니다 :

copyValues("div1", "textarea1"); 
copyValues("div2", "textarea2"); 
copyValues("div3", "textarea3");

출처

2009-11-02 23:42:51 sohum

그걸로하고 싶었던 페이지의 모든 div에 대해 copyValues에 대한 새로운 호출을 의미합니다. 그것은 빨리 빠져 나올 수 있습니다. –

당신이 순수 자바 스크립트를 찾고이 작동 할 경우 - 이런 일이 아주 쉽게 jQuery를 같은 프레임 워크에서 처리 되더라도 :

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
    <title>Untitled Page</title> 
    <script type="text/javascript"> 

     function CopyDivsToTextArea() 
     { 
      var divs = document.getElementsByTagName("div"); 
      var textToTransfer = ""; 
      var pattern = new RegExp("test1"); 

      for(var i=0;i<divs.length;i++) 
      { 
      if(pattern.test(divs[i].className)) 
       { 
        textToTransfer += (divs[i].innerText || divs[i].textContent); 
       } 
      } 
     document.getElementById("ta").value = textToTransfer; 
     } 

    </script> 
</head> 
<body> 
<div class="test1" > Example1 </div > 
<div class="test2" > Example2 </div > 
<div class="test1" > Example3 </div > 
<div class="test3" > Example4 </div > 
<br /> 
<textarea id="ta" cols="50" rows="20"></textarea> 
<br /> 
<input type="button" id="btn" value="Button" onclick="CopyDivsToTextArea();" /> 
</body> 
</html>

출처

2009-11-02 23:49:10 brendan

라이브러리에 대한 의존도가 부족하지만, if (divs [i] .className == "test1")'line : 요소가 여러 개의 CSS 클래스를 가질 수 있기 때문에 취성이 있습니다. 정규 표현식 또는 동등한 비교가 아닌 동등한 비교. 또한 innerHTML은 아마도 잘못된 선택입니다. 텍스트 영역에서 원치 않는 HTML 마크 업으로 끝날 수 있기 때문입니다. 대신에'innerText' /'textContent'를 사용할 수 있습니다 :'textToTransfer + = (divs [i] .innerText || divs [i] .textContent);'. 'innerText'와'textContent'는 꽤 비슷하지만 충분히 좋을 수도 있습니다. –

좋은 점 Tim, 예제를 업데이트했습니다. 모든 시나리오에서 100 % 심사하지 않고 함께 던진 것입니다. 감사! – brendan

+1 elegancy 및 도서관 필요 없음 :) –

divs from textarea

답변

관련 문제