<p>我在使用 JavaScript 更改文本翻译时遇到问题。</p>
<p>这是html代码</p>
<p>
document.getElementById('slider-en1').style.visibility = 'hidden';
document.getElementById('slider-id1').style.visibility = '可见';
函数changeFunc() {
var selectBox = document.getElementById("language_select");
var selectedValue = selectBox.options[selectBox.selectedIndex].value;
// 警报(选定值);
if (selectedValue == 'id') {
document.getElementById('slider-en1').style.visibility = '可见';
document.getElementById('slider-id1').style.visibility = '隐藏';
}
if (selectedValue == 'en') {
document.getElementById('slider-en1').style.visibility = '可见';
document.getElementById('slider-id1').style.visibility = '隐藏';
}
}</pre>
<pre class="brush:html;toolbar:false;"><select class="nav-item has-sub-menu language-selector" id="language_select" onchange="changeFunc();">
<li class="nav-item 子菜单项">
<选项类=“导航链接子菜单链接文本白色”禁用默认选定值=“”>语言选项>
</li>
<li class="nav-item 子菜单项">
</li>
<li class="nav-item 子菜单项">
;
</li>
</ul>
</选择>
<div class="col-9 col-md-10 col-lg-8 mx-auto" id="slider-id1">
<p class="slide-subtitle slim-centerd-text">
印度尼西亚 印度尼西亚 印度尼西亚
</p>
<div class="col-9 col-md-10 col-lg-8 mx-auto" id="slider-en1">
<p class="slide-subtitle slim-centerd-text">
恩恩恩
</p>
</div></pre>
</p>
<p>我尝试使用jquery,但仍然无法正常工作。谢谢您的回答</p>
<p>我尝试隐藏使用 JavaScript 显示和内容,但我的代码无法正常工作</p>
UL LI不是select的有效子元素。
然而,我简化了您的代码以提高效率。
我为每个语言div添加了一个data属性。该属性保存表示内容的语言值。我还创建了一个名为"active"的css类,它将显示适当的语言div,并将语言div默认隐藏。
然后,我使用事件处理程序而不是内联事件(onchange),这是更好的方法,也将帮助您在将来做更多事情。
在我的事件监听器中,我只是获取所选值。然后,我查看是否有任何带有active类的语言div,如果有,则删除它。然后,我找到并将active类添加到适当的语言div。
这个过程将帮助您扩展代码,因为您不需要关心if语句。