내가하는 기능을 쓰기 위해 노력하고 있어요 하나

Question

가치의 선택에 다른 보관함을 비활성화 :

• 가 보관에는 옵션이 선택되지 않은 경우가 제출 '버튼을 비활성화 (즉 빈 문자열이 선택됩니다). 모든 보관 용 계정을 사용하도록 설정합니다.
• 드롭 박스 (빈 문자열이 아닌 문자열)에서 옵션을 선택하는 경우 다른 모든 드롭 상자를 비활성화하고 제출 버튼을 활성화하십시오.

그러나 JavaScript에서 초보자로서 나는 이것을 어떻게 시작할 것인지 전혀 모른다. 어떻게 그러한 코드를 작성합니까?

<form id="form" name="form" method="post" action="confirmation.cshtml"> 
    <select name="start_to_end_time" class="start_to_end_time"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
    </select> 

    <select name="start_to_end_time" class="start_to_end_time"> 
     <option value="3">3</option> 
     <option value="4">4</option> 
    </select> 

    <button type="submit">Submit</button> 

가 어떻게이 기능을 충족 코드를 작성할 수 있습니다 다음과 같이

그래서 내 간단한 HTML는 것입니까? 비활성화로 버튼을로드하여

Answer 1

나는 그것이이 개 HTML 요소와 동일한을주는 것은 좋은 생각이 아니다 생각 이름 속성은 대괄호 []를 사용하지 않는 한. 마지막 하나가 첫 번째 값을 덮어 쓸 수 있습니다. Mootools의를 사용하여

자바 스크립트 :

$$('.start_to_end_time').each(function(element) { 
    element.addEvent('click', function(ev) { 
     $$('.start_to_end_time').each(function(selectbox) { 

       if (element.getProperty('value') != '') { 
        $('button').setProperty('disabled', ''); 
        $$('.start_to_end_time').each(function(b) { 
         if (b != element) { 
          b.setProperty('disabled', 'disabled'); 
         } else { 
          b.setProperty('disabled', ''); 
         } 
        } 
       } else { 
        $('button').setProperty('disabled', 'disabled'); 
        $$('.start_to_end_time').each(function(b) { 
         b.setProperty('disabled', ''); 
        } 
       } 
     }); 
    }); 
}); 

내가 코드를 테스트하지 않았다. 좀 더 읽기 쉽도록 몇 가지 방법을 정의 할 수 있습니다.

Answer 2

시작 :

또한

<button id="myButton" type="submit" disabled='disabled'>Submit</button> 

, 당신의 선택에 onchange를 리스너를 추가 :

<select onchange="myJSFunction()" name="start_to_end_time" class="start_to_end_time"> 
    <option value="3">3</option> 
    <option value="4">4</option> 

후, 작성하는 자바 스크립트 함수 :

을

function myJSFunction(){ 
    var myButton = document.getElementById('myButton'); 
    myButton.removeAttribute("disabled"); 
} 

선택한 값을 확인하고 (이이 onchange를 메소드에 의해 호출 한 함수에서 실행해야합니다) 따라 사용하지 않으려면 :

var mySelect =document.getElementById('mySelect'); 
    var mySelectedIndex = mySelect.selectedIndex; 
if (mySelectedIndex==0){ 
    mySelect.setAttribute("disabled","disabled); 

}