如何让一个输入接受两个脚本？
在我的网站上有一个包含我的书的板块。为了避免混淆，我为导航文本框创建了一个单独的脚本，这样我就可以拥有多本书，而不必让第一本书成为“Booknameone”来进入第一章。
不幸的是，第二个脚本导致我用于整个站点导航的原始脚本无法工作。
目前重新进入那个循环（其实也包含进入书区循环）的唯一方法，是进入搜索框并修改你当前所在的链接。
这确实符合黑客终端的感觉，但一点也不好玩。
（需要说明的是我的站点托管在Neocities上，因此任何解决方案都必须在那上面可用，但我知道即使出现错误信息也可以运行，所以应该没问题。）
这是我的（如果标注错了就是HTML）的代码（用于模板，但无论如何都是相同的代码）：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div id=term>
</div>
<div id=textbox>
<input id="textBox" oninput="testMultipleStrings(this)">
</div>
<script src="https://rattyusmaximus.neocities.org/site-access.js"></script>
<script src="chapter-access.js"></script>
</body>
</html>
那个“site-access.js”是循环，而“chapter-access.js”看起来是这样的：
// remember that to increase the amount of sites, add a comma at the end of the last one, or else you will be unable to access it through the terminal
var myStringDict = {
"one" : "chapterone.htm",
"two" : "chaptertwo.htm",
"three" : "chapterthree.htm",
"four" : "chapterfour.htm",
"five" : "chapterfive.htm"
};
function testMultipleStrings() {
let textBox = document.getElementById("textBox");
if (textBox.value.toLowerCase() in myStringDict) {
window.location.replace(myStringDict[textBox.value.toLowerCase()]);
}
}
看起来没错，对吧？不过如果你去到书站点（请注意这里我只讨论代码，不涉及写作技巧），输入比如“home”应该把你带回主页，但并不是这样。
似乎第二个、章节访问脚本优先，因为输入“two”时，它会把你带到第二章。
那么，我到底哪里做错了？如何修复它，让它能与我那一大串子站点整合在一起？
我认为下面这些代码最适合作为重现该问题的示例：
html：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div id=textbox>
<input id="textBox" oninput="testMultipleStrings(this)">
</div>
<script src="script1.js"></script>
<script src="script2.js"></script>
</body>
</html>
script1将是：
var myStringDict = {
"exampleone" : "example.com",
"othertext" : "othersitehere"
};
function testMultipleStrings() {
let textBox = document.getElementById("textBox");
if (textBox.value.toLowerCase() in myStringDict) {
window.location.replace(myStringDict[textBox.value.toLowerCase()]);
}
}
这将是script2：
var myStringDict = {
"exampletwo" : "example.org",
"othertexttwo" : "othersitehere"
};
function testMultipleStrings() {
let textBox = document.getElementById("textBox");
if (textBox.value.toLowerCase() in myStringDict) {
window.location.replace(myStringDict[textBox.value.toLowerCase()]);
}
}
请告诉我这是否能重现这个问题。
解决方案
这两个脚本定义了相同的全局变量/函数。加载第二个脚本时，它会覆盖第一个脚本的定义。
你需要让它们各自有不同的名称。
var myStringDict1 = { ... }
function testMultipleStrings1() { ... }
和
var myStringDict2 = { ... }
function testMultipleStrings2() { ... }
这也意味着你需要修改 oninput="..."。
如果你只有一个 oninput="..."，但仍然希望有两个独立的脚本，那么你需要另一种实现方法。比如，你可以向映射中添加一个条目，而不是在第二个脚本中覆盖它。下面是实现方法：
myStringDict["exampletwo"] = "example.org"
myStringDict["othertexttwo"] = "othersitehere"
在那种情况下，你就不需要重新定义 testMultipleStrings() 函数。
相关文章
