>  Q&A  >  본문

문제: Javascript의 변경 기능이 유효하지 않습니다.

<p>저는 JavaScript를 사용하여 更改文本翻译时遇到问题을 사용하고 있습니다.</p> <p>这是html代码</p> <p> <pre class="brush:js;toolbar:false;">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; // 경고(선택된 값); 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'; } }</pre> <pre class="brush:html;toolbar:false;"><select class="nav-item has-sub-menu 언어 선택기" id="언어_select" onchange="changeFunc();"> <ul class="하위 메뉴"> <li class="nav-item 하위 메뉴 항목"> <option class="nav-link sub-menu-link text-white" 비활성화된 기본 선택 값="">언어</option> </li> <li class="nav-item 하위 메뉴 항목"> <option class="nav-link sub-menu-link text-dark" id="id" value="id">인도네시아</option> </li> <li class="nav-item 하위 메뉴 항목"> <option class="nav-link sub-menu-link text-dark" id="en" value="en">영어</option> </li> </ul> </선택> <div class="col-9 col-md-10 col-lg-8 mx-auto" id="slider-id1"> <p class="slide-subtitlearrow-centerd-text"> 인도네시아 인도네시아 인도네시아 </p> </div> <div class="col-9 col-md-10 col-lg-8 mx-auto" id="slider-en1"> <p class="slide-subtitlearrow-centerd-text"> 엉 엉 엉 </p>
</p> <p>저는 jquery를 사용하여 jquery를 수정했습니다. <p>我尝试使는 JavaScript를 사용하여 显示 and 隐藏内容,但我的代码无法正常工作</p>
P粉654894952P粉654894952410일 전576

모든 응답(1)나는 대답할 것이다

  • P粉046387133

    P粉0463871332023-09-06 00:19:35

    UL LI는 select의 유효한 하위 요소가 아닙니다.

    하지만 효율성을 위해 코드를 단순화했습니다.

    각 언어 div에 데이터 속성을 추가했습니다. 이 속성은 콘텐츠를 나타내는 언어 값을 보유합니다. 또한 적절한 언어 div를 표시하고 기본적으로 언어 div를 숨기는 "active"라는 CSS 클래스를 만들었습니다.

    그런 다음 인라인 이벤트(onchange) 대신 이벤트 핸들러를 사용했습니다. 이는 더 나은 방법이며 앞으로 더 많은 작업을 수행하는 데 도움이 될 것입니다.

    내 이벤트 리스너에서는 선택한 값만 가져옵니다. 그런 다음 활성 클래스가 있는 언어 div가 있는지 확인하고 있으면 삭제합니다. 그런 다음 활성 클래스를 찾아서 적절한 언어 div에 추가합니다.

    이 프로세스는 if 문에 신경 쓸 필요가 없기 때문에 코드를 확장하는 데 도움이 됩니다.

    으아악 으아악 으아악

    회신하다
    0
  • 취소회신하다