私たちは JavaScript の修正版翻訳を使用中に問題に遭遇しました。
これはhtml代詞
です。
document.getElementById('slider-en1').style.visibility = 'hidden'; document.getElementById('slider-id1').style.visibility = 'visible'; 関数changeFunc() { var selectBox = document.getElementById("言語選択"); var selectedValue = selectBox.options[selectBox.selectedIndex].value; // アラート(selectedValue); if (selectedValue == 'id') { document.getElementById('slider-en1').style.visibility = 'visible'; document.getElementById('slider-id1').style.visibility = 'hidden'; } if (selectedValue == 'en') { document.getElementById('slider-en1').style.visibility = 'visible'; document.getElementById('slider-id1').style.visibility = 'hidden'; } } jquery を使用してみましたが、正常に動作しませんでした。
我尝试は JavaScript 表示と隐藏コンテンツを使用していますが、我的代网無法通常工作
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
UL LI は select の有効な子要素ではありません。
ただし、効率を高めるためにコードを簡略化しました。
各言語 div にデータ属性を追加しました。このプロパティは、コンテンツを表す言語値を保持します。また、適切な言語 div を表示し、言語 div をデフォルトで非表示にする「active」という CSS クラスも作成しました。
次に、インライン イベント(onchange) の代わりにイベント ハンドラーを使用しました。これはより良い方法であり、将来さらに多くのことを行うのにも役立ちます。
私のイベント リスナーでは、選択された値を取得するだけです。次に、アクティブなクラスを持つ言語 div が存在するかどうかを確認し、存在する場合はそれを削除します。次に、アクティブなクラスを見つけて、適切な言語 div に追加します。
このプロセスは、if ステートメントを気にする必要がないため、コードを拡張するのに役立ちます。