复选框和组合文本输出
Posted
技术标签:
【中文标题】复选框和组合文本输出【英文标题】：Check boxes and combined text output 【发布时间】：2018-07-07 18:05:51 【问题描述】：我需要有关组合文本框输出的代码方面的帮助。
See this picture with the final result
A.输入：用户应该在不同的复选框选项中进行选择。
B.输出：选定的文本字符串应该集中到一个更新的文本框中。选中复选框后，文本框应立即更新，因此您将直接查看最终结果。
C.传输：通过单击按钮，文本框的内容应复制到内存中，以便稍后插入其他软件。
有什么建议吗？
【问题讨论】：
我建议你展示你迄今为止尝试过的东西。所以人们可以看到你被困在哪里并能够帮助你。你所拥有的是需求而不是 OP 【参考方案1】：<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function()
$("input[name='country']").change(function()
var checkedCountries = $("input[name='country']:checked");
var countries = [];
for(var i = 0; i<checkedCountries.length; i++)
countries.push(checkedCountries[i].value + ".");
$("#countryList").val(countries.join(" "));
);
$("#copyBtn").click(function()
var copyText = document.getElementById("countryList");
copyText.select();
document.execCommand("Copy");
alert("Copied the text: " + copyText.value);
);
);
</script>
</head>
<body>
<input type="checkbox" name="country" value="America">America<br>
<input type="checkbox" name="country" value="Burma">Burma<br>
<input type="checkbox" name="country" value="China">China<br>
<input type="checkbox" name="country" value="Denmark">Denmark<br>
<input type="checkbox" name="country" value="England">England<br>
<input type="checkbox" name="country" value="France">France<br>
<textarea id="countryList"></textarea></br>
<input type="button" id="copyBtn" value="Copy Country List"/>
</body>
</html>
您可以使用上面 sn-p 中给出的纯 javascript 方式将文本复制到剪贴板。
【讨论】：
如果您查看 exec 命令的 compatibility table，则复制功能已于 2016 年 9 月 20 日添加到 safari。这可能有点新，除非您可以向用户保证不会过时Safari 将使用您的网站。 Nitin Kothwal 的示例工作正常（对于一个参数 COUNTRY），但我有多个参数。如何在文本框中包含这些（大写、颜色、数字），以便在选中复选框时立即将所有参数包含在文本框中？如果可能，还包括 NUMBER（文本输入而不是复选框）。来源：link【参考方案2】：A.输入
您需要编写一些代码来监听复选框事件，我建议您研究一下 javascript。 Javascript 是一种在所有主要网络浏览器中都可用的编程语言。 （这几乎是您唯一的选择）。 https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/JavaScript_basics 如果您是 js 新手，请尝试在 Google 上搜索“从 js 中的复选框更改中获取事件”之类的内容
B.输出 当您的代码收到一个复选框事件时，您会希望它遍历复选框，找出哪些复选框被选中，然后组成一个字符串。然后代码可以将该字符串插入到文本字段中。
您还可以找出更改了哪一项，并据此决定如何更改现有文本，或者记住复选框的复选框状态以生成输出。这会更快，但可能会使事情变得过于复杂。
C.我假设您的意思是复制到剪贴板...看看这个库！ https://clipboardjs.com/
【讨论】：
是的，我想将文本框的内容复制到剪贴板。我尝试在我的测试页面（www.a-star.dk）上使用clipboardjs，但没有成功。我不确定我在这里做错了什么，但是在工作时它可以解决问题。以上是关于复选框和组合文本输出的主要内容，如果未能解决你的问题，请参考以下文章