Javascript-使用按钮将文本从一个字段复制到另一个字段
[英]Javascript - copy text from one field to another using a button
问题描述
I am trying to figure out how to insert text from one text field to another using a button. 
我试图弄清楚如何使用按钮将文本从一个文本字段插入到另一个文本字段。 This is what I have so far: 这是我到目前为止的内容：
function copy(ID_value) {
var textToCopy = document.getElementById(ID_value).innerHTML;
var whereToCopy = document.getElementById("text");
whereToCopy.value += textToCopy;
}
HTML 的HTML
<div id="opt">
<BUTTON id="1"onClick="copy(1);"> Option 1</BUTTON>
<BUTTON id="11"onClick="copy(11);"> Option 2</BUTTON><br>
<BUTTON id="2"onClick="copy(2);"> Option 3</BUTTON> or
<TEXTAREA ID="name" style="height:25px; width:300px;"></TEXTAREA>
<BUTTON id="3"onClick="copy(name);">Send</BUTTON><br>
<BUTTON id="4"onClick="copy(4);"> Option 4</BUTTON>
<BUTTON id="5"onClick="copy(5);"> Option 5</BUTTON>
<BUTTON id="6"onClick="copy(6);"> Option 6</BUTTON>
<BUTTON id="7"onClick="copy(7);"> Option 7</BUTTON>
<BUTTON id="8"onClick="copy(8);"> Option 8</BUTTON>
<BUTTON id="9"onClick="copy(9);"> Option 9</BUTTON>
<BUTTON id="10"onClick="copy(10);"> Option 10</BUTTON>
<p />
</div>
<TEXTAREA ID="text" style="height:100px; width:600px;">
</TEXTAREA>
Just as the buttons work, I need the "Send" button to send the text in the small field, to the large field, in any given order (Just as how each Option button inserts text in to the large field with proper spacing reguardless of order) 就像按钮正常工作一样，我需要“发送”按钮以任意给定的顺序将小文本发送到大文本（就像每个“选项”按钮如何以适当的间距将文本插入大文本一样）订购）
Any help would be greatly appreciated. 任何帮助将不胜感激。
6 个解决方案
解决方案1
1 2014-07-28 05:11:07
There are two problems in your question. 您的问题有两个问题。
1) you are passing name not "name" so it will say name is undefined . 1）您传递的name不是"name"因此会说name是undefined 。
2) Because textbox has property value to get it's content your function is not working. 2）由于textbox具有获取其内容的属性value ，因此您的函数无法正常工作。
Leave your copy function as it is. 保持copy功能不变。 Add one more function copyFromTextBox and call that on send button click . 再添加一个函数copyFromTextBox并在click send按钮时调用它。
<BUTTON id="3"onClick="copyFromTextbox();">Send</BUTTON><br>
function copyFromTextbox(id){
var textToCopy = document.getElementById('name').value;
var whereToCopy = document.getElementById("text");
whereToCopy.value += textToCopy;
}
解决方案2
0 2014-07-28 05:05:15
what you want to do is just copy the value of one text field into another. 您要做的就是将一个文本字段的值复制到另一个文本字段。 You can do this: 你可以这样做：
function copyToAnother()
{
var text1 = document.getElementById(id_of_first_text_field);
var text2 =document.getElementById(id_of_second_text_field);
text2.value = text1.value; // copy value of Ist field into second Field
}
and then on your copy button's onclick action reffer that function. 然后在复制按钮的onclick操作上恢复该功能。
解决方案3
0 2014-07-28 05:10:48
Your problem here is that your passing a number and not a string to the copy function. 这里的问题是您将数字而不是字符串传递给复制函数。
Change copy(1) to copy('1') and things will work. copy(1)更改为copy('1') ，一切正常。
解决方案4
0
Try this code,This is a program similar to your question 试试这个代码，这是一个类似于您的问题的程序
<html>
<head>
<script>
function copy_data(val){
var a = document.getElementById(val.id).value
document.getElementById("text_to").value=a
}
</script>
</head>
<TEXTAREA ID="text_from" style="height:100px; width:600px;">
</TEXTAREA>
<TEXTAREA ID="text_to" style="height:100px; width:600px;">
</TEXTAREA>
<button onclick=copy_data(text_from)>Copy</button>
<html>
解决方案5
0 2015-08-21 17:44:30
I testing it desktop browsers: Firefox, Chrome, Safari. 我测试了桌面浏览器：Firefox，Chrome，Safari。
<BUTTON id="3"onClick="if(document.getElementById('name').value!='')
text.value+=' '+document.getElementById('name').value">Send</BUTTON>
or 要么
for(i=0;i<10;i++)document.querySelectorAll('button')[i].onclick=function(){ text.value+=this.innerHTML}; snd.onclick=function(){if(document.getElementById('name').value!='') text.value+=' '+document.getElementById('name').value}
<div id="opt"> <button> Option 1</button> <button> Option 2</button><br> <button> Option 3</button> or <textarea id="name" style="height:25px;width:300px"></textarea> <input type="button" id="snd" value="Send"/><br> <button> Option 4</button> <button> Option 5</button> <button> Option 6</button> <button> Option 7</button> <button> Option 8</button> <button> Option 9</button> <button> Option 10</button> </div> <br><br><textarea id="text" style="height:100px;width:600px"></textarea>
name. 名称。 -not work. -不行。 That question asked Jul 28 '14 at 4:55 Why that question is top on main page? 这个问题于2014年7月28日在4:55提出，为什么这个问题在首页上居首？
解决方案6
-1 2014-07-28 05:05:49
function copy() {
var areaA = document.getElementById("areaA");
var areaB = document.getElementById("areaB");
var valueA = areaA.value;
areaB.value = valueA;
}
just from a quick look you need to add "" to getElementById, and use .value instead of innerHTML should work find. 只需快速浏览一下，您需要在getElementById中添加“”，并使用.value而不是innerHTML应该可以找到。
here is a example. 这是一个例子。 http://jsfiddle.net/6e67Y/ http://jsfiddle.net/6e67Y/
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.