jQuery/JavaScript获取输入值，然后复制到剪贴板

我有一堆

input

元素，通过javascript单击，我获得这些输入的值，并将其粘贴到

div

的某个地方
请运行下面截取的代码以检查

$（'#getthelist'）。单击（函数（）{
$（'.inputs>li.color'）.map（函数（）{
返回{
名称：this.closest（'[id]'）.id，
值：$（this.val（）
}
}).get（）.forEach（函数（e）{
$（'.list'）.append（''+'\''+e.name+'\'：\'+e.value+'\'，'）；
});
});
ul，li{
列表样式：无；
保证金：0；
填充：0；
}
.名单{
利润率：10px；
宽度：270px；
填充：25px；
背景色：#FAFB；
}



单击以获取颜色值





我试着给你们两个问题的答案

问题一的答案
您应该在设置新值之前重置HTML内容

问题2的答案
您应该使用document.executeCommand（“复制”）来复制文本

希望这有助于解决您的问题


函数copyData（copyText）{
$（“body”）.append（$（“”）.val（copyText.attr（{id:“txtareaCopyData”}））；
var copyText=document.querySelector（“txtareaCopyData”）；
copyText.select（）；
文件。执行命令（“副本”）；
$（“#txtareaCopyData”）.remove（）；
}
$（'#getthelist'）。单击（函数（）{
//清除html div内容
$（'.list'）.html（“”）；
var copyText=“”；
$（'.inputs>li.color'）.map（函数（）{
返回{
名称：this.closest（'[id]'）.id，
值：$（this.val（）
}
}).get（）.forEach（函数（e）{
var\u data=''+'\''+e.name+'\'：\'+e.value+'\'，'；
$（'.list'）。追加（_数据）；
copyText+=\u数据；
});
copyData（copyText）；
document.querySelector（“txtCopyArea”）.addEventListener（“单击”，copyData）；
});
ul，
李{
列表样式：无；
保证金：0；
填充：0；
}
.名单{
利润率：10px；
宽度：270px；
填充：25px；
背景色：#FAFB；
}



单击以获取颜色值





我试着给你们两个问题的答案

问题一的答案
您应该在设置新值之前重置HTML内容

问题2的答案
您应该使用document.executeCommand（“复制”）来复制文本

希望这有助于解决您的问题


函数copyData（copyText）{
$（“body”）.append（$（“”）.val（copyText.attr（{id:“txtareaCopyData”}））；
var copyText=document.querySelector（“txtareaCopyData”）；
copyText.select（）；
文件。执行命令（“副本”）；
$（“#txtareaCopyData”）.remove（）；
}
$（'#getthelist'）。单击（函数（）{
//清除html div内容
$（'.list'）.html（“”）；
var copyText=“”；
$（'.inputs>li.color'）.map（函数（）{
返回{
名称：this.closest（'[id]'）.id，
值：$（this.val（）
}
}).get（）.forEach（函数（e）{
var\u data=''+'\''+e.name+'\'：\'+e.value+'\'，'；
$（'.list'）。追加（_数据）；
copyText+=\u数据；
});
copyData（copyText）；
document.querySelector（“txtCopyArea”）.addEventListener（“单击”，copyData）；
});
ul，
李{
列表样式：无；
保证金：0；
填充：0；
}
.名单{
利润率：10px；
宽度：270px；
填充：25px；
背景色：#FAFB；
}



单击以获取颜色值






将数据保存在localStorage.setItem中（返回值.map必须保存在localStorage中）

使用localStorage.getItem获取数据（使用为项设置的密钥从localStorage获取数据）

使用handlebar.js创建模板，单击复选框时，使用从localstorage获取的数据呈现模板

对于新数据，必须更新localstorage

将数据保存在localStorage.setItem中（返回值.map必须保存在localStorage中）

使用localStorage.getItem获取数据（使用为项设置的密钥从localStorage获取数据）

使用handlebar.js创建模板，单击复选框时，使用从localstorage获取的数据呈现模板

对于新数据，您必须更新localstorage。
我已经从Dipak chavda测试了解决方案，但它对我也不起作用。问题是输入的类型是隐藏的。所以我把它改成了隐藏文本区。当您尝试复制时，我会让它显示一段时间，聚焦它，选择它的值，然后执行复制。它是有效的；）


函数copyData（copyText）{
var$txtCopyArea=$（“#txtCopyArea”）；
//将文本设置为值
$txtCopyArea.val（copyText）；
//使文本区域可见
$txtCopyArea.removeClass（'hidden'）；
/*聚焦并选择文本字段*/
$txtCopyArea.focus（）.select（）；
/*复制文本字段内的文本*/
文件。执行命令（“副本”）；
/*警告复制的文本*/
警报（“复制文本：+copyText”）；
//隐藏文本区域
$txtCopyArea.addClass（'hidden'）；
}
$（'#getthelist'）。单击（函数（）{
//清除html div内容
$（'.list'）.html（“”）；
var copyText=“”；
$（'.inputs>li.color'）.map（函数（）{
返回{
名称：this.closest（'[id]'）.id，
值：$（this.val（）
}
}).get（）.forEach（函数（e）{
var\u data=''+'\''+e.name+'\'：\'+e.value+'\'，'；
$（'.list'）。追加（_数据）；
copyText+=\u数据；
});
copyData（copyText）；
});
ul，
李{
列表样式：无；
保证金：0；
填充：0；
}
.名单{
利润率：10px；
宽度：270px；
填充：25px；
背景色：#FAFB；
}
.隐藏{
显示：无；
}



点击t