从div到textarea的内容

时间:2009-11-02 23:36:19

标签: php javascript html copy textarea

我想将具有特定类的所有div的文本传输到同一页面上的textarea。

我该怎么做?

例如:

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

我想转移div类test1的内容 并且在textarea中应该显示“Example1”和“Example3”。

请帮忙! javascript或php

约翰

5 个答案:

答案 0 :(得分:9)

使用jQuery很容易做到这一点:

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

上面将使用类“text1”遍历每个元素,并将其文本节点值附加到textarea中的文本。

答案 1 :(得分:3)

如果你正在寻找纯粹的javascript,这可行 - 尽管像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>

答案 2 :(得分:0)

我建议使用div的“id”属性而不是class。基本上,您需要编写一个使用GetElementById()或GetElementByObject()的JavaScript函数。

然后定义一个调用该函数的按钮,传递div的id和textarea的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");

答案 3 :(得分:0)

你可以通过使用jquery

来做到这一点

$(document).ready(function(){
  $("#text").keyup(function(){
    var text = $("#text").val();
    $(".test").html(text);
  })
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test"></div>
<textarea id="text"></textarea>

答案 4 :(得分:0)

function copydivtext(){
   var x = document.getElementsByClassName('test1');

   var textarea = document.createElement("textarea");
   textarea.innerHTML = x[0].innerHTML + x[1].innerHTML;
   document.body.appendChild(textarea);
}
copydivtext();