这是我第一次在这个论坛上发帖,但我已经潜伏多年了。不管怎样,我正在制作一个非常简单的工具,并且需要一些帮助。我已经很长时间没有编码了,所以请原谅我的格式和可能可怕的多余代码。我遇到的问题是,当我在 #1 中输入文本,然后在 #2 上选择一个将两个字段连接在一起的站点,最后选择副本并在 #3 上重置时,效果很好。问题是,它在生成的 URL 之前和之后添加了一个中断。我尝试了无数种不同的方法来阻止它们,只是为了仅复制连接的 URL,但我的技能还达不到要求。我确信对于本网站上的大多数(如果不是全部)来说,这都是一个简单的修复,所以提前致谢!
此外,如果有人有任何想法如何减少其他任何事情以使其更加高效和简单,我会倾听。
谢谢!
<!DOCTYPE html>
<html>
<head>
<style>
input[type=text]
{
width: 100%;
font-size: 15px;
padding: 10px;
margin: 0px;
box-sizing: border-box;
background-color: #D5DBDB;
border: 2px solid #232F3E;
border-radius: 5px;
}
.button
{
border-radius: 5px;
background-color: #D5DBDB;
border: 2px solid #232F3E;
color: black;
text-aline: center;
font-size: 15px;
padding: 10px;
width: 150px;
transition: all 0.3s;
cursor: pointer;
margin: 5px;
}
.button:hover
{
background-color: #232F3E;
border: 2px solid #FF9900;
color: white;
}
.button:focus
{
background-color: #FF9900;
color: black;
}
p
{
border-left: 10px solid red;
background-color: #D5DBDB;
border-radius: 5px;
text-indent: 5px;
font-size: 12.5px;
width: 100%;
}
div
{
text-align: right;
}
</style>
</head>
<body>
<font size="3"><b>1:</b> Input field for XXXXXXX:</font><br><br>
<input type="text" id="testurlinput" placeholder="never provide XXXXXXX to XXXXXXX">
<br><br><hr><br>
<font size="3"><b>2:</b> Select the site:</font><br><br>
<button class="button" onclick="myFunction('http://www.google.com/')">Google</button>
<button class="button" onclick="myFunction('http://x.com/')">X (<i>Twitter</i>)</button>
<button class="button" onclick="myFunction('http://www.facebook.com/')">Facebook</button>
<button class="button" onclick="myFunction('http://www.instagram.com/')">Instagram</button>
<button class="button" onclick="myFunction('https://bsky.app/')">Bluesky</button><br>
<hr><br>
<font size="3"><b>3:</b> Provide XXXXXXX with the following XXXXXXX:</font>
<p id="testlink"></p>
<button class="button" onclick="copyToClipboard('testlink')">Copy Link &<br>Reset Page</button>
<br><br><hr><br>
<hr>
<script>
function myFunction(a)
{
var z = document.getElementById("testurlinput").value;
document.getElementById("testlink").innerHTML = a + z;
}
</script>
<script>
function copyToClipboard(id)
{
var from = document.getElementById(id);
var range = document.createRange();
window.getSelection().removeAllRanges();
range.selectNode(from);
window.getSelection().addRange(range);
document.execCommand('copy');
window.getSelection().removeAllRanges();
window.location.reload();
}
</script>
</body>
</html>
目标只是解决开头和结尾的中断问题,以便得到一个干净的 URL。至于我尝试过的,我已经尝试了多种不同的函数格式,但没有成功。
在提交之前,我什至在“查看 Stack Overflow 上已有的问题以查看您的问题是否重复”下查看了更多内容。部分。还是什么都没有。
我只关注文本/或值,而不是整个 html 元素——这可能会导致
break before and a break after the generated URL
出现问题
未经测试的解决方案,如有任何问题请告诉我
function copyToClipboard() {
let textToCopy = document.getElementById("testlink").innerText;
let tempInput = document.createElement("input");
document.body.appendChild(tempInput);
tempInput.value = textToCopy;
tempInput.select();
document.execCommand("copy");
document.body.removeChild(tempInput);
window.location.reload();
}