无法在IE中隐藏和取消隐藏潜水的代码

我不是一个好的JS，因为我使用的代码是一位同事为我编写的，它在Chrome中运行良好，但在IE中表现不佳。

代码是为了让我有一个列表，我可以点击它来显示隐藏的div，当我点击列表中的另一个链接时，它会隐藏最后一个div，并取消隐藏最后点击的div等。

这是我的JS

function hideClass(id){
$('.objections').addClass('hide');
$('#'+id+'_container').removeClass('hide');
}

我的HTML 中有这个

onclick="hideClass(this.id)"

有没有办法改变它，使其在IE中工作？

正如我所说，我不擅长纯JS的HTML CSS，所以我不知道从哪里开始

如果看不到代码，很难确切知道是什么失败了。我猜到了你可能在做什么，并想出了这个基本代码，它在IE中对我有效。然而，IE最初确实阻止了脚本，我必须点击才能允许。所以要小心。

function hideClass(id) {
$('.objections').addClass('hide');
$('#' + id + '_container').removeClass('hide');
}

.hide {
opacity: 0;
}

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
<div id="myID" class="objections" onclick="hideClass(this.id)">
<h1>I OBJECT!</h1>
</div>
<div id="myID_container" class="hide">
<h1>Can you see me now?</h1>
</div>
</body>
</html>

不过，由于您使用的是jQuery，所以这段代码要干净一些：

function hideClass(div) {
$(div).hide();
$('#' + div.id + '_container').show();
}

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
<div id="myID" class="objections" onclick="hideClass(this)">
<h1>I OBJECT!</h1>
</div>
<div id="myID_container" style="display:none">
<h1>Can you see me now?</h1>
</div>
</body>
</html>

相关内容

最新更新

热门标签：