Javascript - 从一个开关语句大小写到另一个开关语句



我试图在跳转到不同开关语句的开关语句中有一个案例。

实际上,我希望用户在文本框中键入"关闭页面",并且在浏览器关闭页面之前,我希望询问用户是否确定。键入"yes"将关闭页面,键入"no"将返回到上一个 switch 语句。

我需要使用 switch 语句,因为用户可以在文本框中键入许多其他内容,这些内容会生成不同的反馈。

我为每个switch语句使用了不同的文本框,并在必要时交换它们,以尝试能够使用相同的键调用这两个函数。

这就是我所拥有的。但它不起作用... 有什么帮助吗?

function SwapDivs(div1, div2) {
d1 = document.getElementById(div1);
d2 = document.getElementById(div2);
if (d2.style.display == "none") {
d1.style.display = "none";
d2.style.display = "block";
} else {
d1.style.display = "block";
d2.style.display = "none";
}
}
function myFunction01() {
var text;
var answers = document.getElementById("myInput01"").value;
switch (answers) {
case "close page":
text = "are you sure?";
SwapDivs('div01', 'div02');
break;
default:
text = "no valid input";
}
document.getElementById("feedback").innerHTML = text;
}
function myFunction02() {
var text;
var answers = document.getElementById("myInput02").value;
switch (answers) {
case "yes":
text = "Why?";
break;
case "no":
text = "Good!";
break;
default:
text = "no valid input";
}
document.getElementById("feedback").innerHTML = text;
}
<p id="feedback"></p>
<div id="div01" style="display:block">
<input id="myInput01" type="text" placeholder="This is TextBox 01." onKeyDown="if(event.keyCode==13) myFunction01();">
</div>
<div id="div02" style="display:none">
<input id="myInput02" type="text" placeholder="This is TextBox 02." onKeyDown="if(event.keyCode==13) myFunction02();">
</div>

你对第一个函数有一个额外的引用:

var answers = document.getElementById("myInput01"").value;

它应该是:

var answers = document.getElementById("myInput01").value;

我了解行为是:

  • 如果用户输入"关闭页面"以外的任何文本,我们会向他们反馈无效输入。

    • 如果用户进入"关闭页面",我们会询问他们是否确定并更改为输入 2。

    • 在输入 2 上,如果他们输入是,我们说
    • 为什么,如果他们输入否,我们说好,否则说没有有效输入。

如果这是意料之中的,代码对我有用。

您可以在下面运行这个(转换为 ES6(:

const SwapDivs = (div1, div2) => {
const d1 = document.getElementById(div1);
const d2 = document.getElementById(div2);
if (d2.style.display == "none") {
d1.style.display = "none";
d2.style.display = "block";
} else {
d1.style.display = "block";
d2.style.display = "none";
}
};
const myFunction01 = () => {
let text;
const answers = document.getElementById("myInput01").value;
switch (answers) {
case "close page":
text = "are you sure?";
SwapDivs('div01', 'div02');
break;
default:
text = "no valid input";
}
document.getElementById("feedback").innerHTML = text;
};
const myFunction02 = () => {
let text;
const answers = document.getElementById("myInput02").value;
switch (answers) {
case "yes":
text = "Why?";
break;
case "no":
text = "Good!";
break;
default:
text = "no valid input";
}
document.getElementById("feedback").innerHTML = text;
};
<p id="feedback"></p>
<div id="div01" style="display:block">
<input id="myInput01" type="text" placeholder="This is TextBox 01." onKeyDown="if(event.keyCode==13) myFunction01();">
</div>
<div id="div02" style="display:none">
<input id="myInput02" type="text" placeholder="This is TextBox 02." onKeyDown="if(event.keyCode==13) myFunction02();">
</div>

最新更新