抱歉,如果这是一个愚蠢的问题,我是 JavaScript 新手。我正在尝试创建链接,该链接将根据您所在的页面自动更新。当我只有其中一个时,它工作得很好,但显然,第一个链接也给了我与第一个链接相同的输出。这是我想要实现的目标:
<html>
<head>
<!-- QR API generator call -->
<script>
baseurl="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data="
function buildQR(item)
{
item.href=baseurl+window.location.href;
return true;
}
</script>
<!-- Sharing append link via JavaScript -->
<script>
baseurl="whatsapp://send?text="
function buildURL(item)
{
item.href=baseurl+window.location.href;
return true;
}
</script>
</head>
<body>
<a onclick="return buildQR(this)" href="">Generate QR</a>
<a onclick="return buildURL(this)" href="" data-action="share/whatsapp/share">Share on WhatsApp</a>
</body>
</html>
感谢您帮助我。
P.S.我正在努力实现this ,但这次有两个链接。
最佳答案
问题是由于 baseurl
变量的范围造成的。它被声明为全局变量,这意味着在第一个脚本标记中它被设置为初始值,然后在第二个脚本标记中它被设置为新值。这两个脚本都会在页面加载时执行,因此几乎可以立即将 baseurl
设置为等于第二个值。
我建议阅读有关变量作用域 ( https://developer.mozilla.org/en-US/docs/Glossary/Scope ) 和闭包 ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures ) 的更多信息,以更好地理解该问题。
要修复此问题,您可以为 baseurl
的第二个实例使用不同的变量名称(可能类似于 baseurl1
),或者将变量声明移至函数声明将它们包装在这些闭包中。
这样的事情应该有效:
<!-- QR API generator call -->
<script>
function buildQR(item) {
var baseurl="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=";
item.href=baseurl+window.location.href;
return true;
}
</script>
<!-- Sharing append link via JavaScript -->
<script>
function buildURL(item) {
var baseurl="whatsapp://send?text=";
item.href=baseurl+window.location.href;
return true;
}
</script>
关于javascript - 调用不同的 JavaScript 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58738215/