JSP에서 JavaScript onclick 이벤트

Question

Jsp에서 다른 드롭 다운의 선택에 따라 드롭 다운 목록에서 동적으로 값을 선택하려고합니다. 예 : 두 개의 드롭 다운 1-A, B 및 드롭 다운 2의 값이 1에서 10 사이입니다. 그래서 A를 선택하면 드롭 다운에서 5 개의 값을 onclick 이벤트를 기반으로 동적으로 선택합니다. 가능한가요?

Answer 1

먼저 JSP와는 아무런 관련이 없습니다. 클라이언트 측 상호 작용이므로 JavaScript를 사용하여이를 관리해야합니다.

<select>을 사용하여 드롭 다운 메뉴를 사용하는 경우 첫 번째 드롭 다운에 대해 change 이벤트를 캡처해야합니다. 드롭 다운 값이 변경 될 때마다 트리거됩니다.

코드를 더 쉽게 읽고 크로스 브라우저 문제를 피하려면 jQuery를 사용하여이 상황을 처리하십시오. 당신이 말을 ID 세트와 <select> 요소가있는 경우

따라서, dropdown1이 시도 할 수 있습니다 :

jQuery("#dropdown1").change(function() { 

    var selectedValue = jQuery(this).val(); 

    // Now use to value to do other stufffs 

}); 

을하지만, 당신이 그것을 여러 선택할 수는 없습니다 두 번째의 '드롭 다운'가있는 경우 값.

, 당신은 단지 지금 <select multiple="multiple">

를 사용할 필요가있다

, 당신의 요구 사항과 논리의 인식하지 오전 : 하나의 기본 옵션은 목록에이 드롭 다운을 변환 multiple="multiple" (http://www.w3schools.com/tags/att_select_multiple.asp 참조)를 사용하여 여러 slection에 있도록하는 것입니다 첫 번째 드롭 다운의 각 항목에 대해 두 번째 드롭 다운의 특정 값을 가져옵니다. 하지만 여기에 자신의 논리를 적용해야 할 것 같습니다.

그러나, 값 A' of dropdown1 the selected values in dropdown2 will be '1', '2' and '4'; for value B에 대한 'dropdown2에서 dropdown1 선택된 값의 것'의 그 생각하자 2 ','5 '및'6 ','8 '과'10 '이 같은 코드를 사용할 수 있습니다

jQuery(document).ready(function() { 
    jQuery("#dropdown1").change(function() { 

     var selectedValue = jQuery(this).val(), 
      mappedValues = { 
       "A": {"1": true, "2": true, "4": true}, 
       "B": {"2": true, "5": true, "6": true, "8": true, "10": true} 
      }, 
      selectedMappedValues = mappedValues[selectedValue] || {}, 
      dropdown2 = jQuery("#dropdown2"), 
      dropdown2Options = dropdown2.find('option'), 
      dropdown2Option; 

     dropdown2Options.prop('selected', false); 
     dropdown2Options.each(function() { 
      dropdown2Option = jQuery(this); 
      if (selectedMappedValues[dropdown2Option.val()]) { 
       dropdown2Option.prop('selected', true); 
      } 
     });  

    }); 
}); 

라이브 예 : http://jsfiddle.net/sudipto/uzmbko17/

Answer 2

이 시도. 이 jsp 코드입니다.

<select id="dropdown1" name="dropdown1" onchange="selectValue()"> 
    <option value="a">A</option> 
    <option value="b">B</option> 
</select> 
<select id="dropdown2" name="dropdown2"> 
    <option value="a1">1</option> 
    <option value="a2">2</option> 
    <option value="a3">3</option> 
    <option value="a4">4</option> 
    <option value="a5">5</option> 
    <option value="a6">6</option> 
    <option value="a7">7</option> 
    <option value="a8">8</option> 
    <option value="a9">9</option> 
    <option value="a10">10</option> 
</select> 

이 자바 스크립트 함수

function selectValue(){ 
if(document.getElementById("dropdown1").value == a){ 
document.getElementById("dropdown2").value = a5; 
} 
} 

그게의 all.thanx이다.