我有一个使用 HTML、CSS 和 Javascript 编写的切换按钮代码。此代码的目的是在选中复选框时激活或选择 href 链接。这在 JSBin.com 上运行良好。但是当我在 Linux 平台上的 Flask 服务器上运行时，复选框会立即取消选中，以便按钮切换一秒钟并返回到关闭位置。我不知道为什么会这样。
$(function(){
$("input[type='checkbox']").change(function(){
var item=$(this);
if(item.is(":checked"))
{
$('#On').get(0).click();
}
else
{
$('#Off').get(0).click();
}
});
})
$(document).ready(function(){
//$("#Off").hide();
$("#On").click(function(){
$("#On").hide();
$("#Off").show();
});
$("#Off").click(function(){
$("#Off").hide();
$("#On").show();
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<title>{{ title }}</title>
</head>
<body>
<body>
<input type="checkbox" > <br/>
<h1>
<a href="/On" id="On" class="">ON</a>
</h1>
<h1>
<a href="/Off" id="Off" class="off_class">OFF</a>
</h1>
</body>
</body>
</html>最佳答案
改为在 href 中使用 #，代码运行正常。
$(function() {
$("input[type='checkbox']").change(function() {
var item = $(this);
if (item.is(":checked")) {
$('#On').get(0).click();
} else {
$('#Off').get(0).click();
}
});
})
$(document).ready(function() {
//$("#Off").hide();
$("#On").click(function() {
$("#On").hide();
$("#Off").show();
});
$("#Off").click(function() {
$("#Off").hide();
$("#On").show();
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox"> <br/>
<h1>
<a href="#" id="On" class="">ON</a>
</h1>
<h1>
<a href="#" id="Off" class="off_class">OFF</a>
</h1>关于javascript - 切换按钮适用于 JSbin 但不适用于 Flask 服务器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42806852/