체인으로 선택 아니요 jQuery 또는 Ajax로 선택

Question

XAMPP Lite - USB 버전을 사용하고 있으며 내 XAMPP에서 작동하지 않는 AJAX에 의존하기 때문에 jQuery 체인으로 연결된 선택 상자 스크립트가 작동하지 않습니다.

내가이 선택 상자를 가지고 :

나는 지방을 선택하고 선택 "도시"의 이름으로 다른 도시를로드 할 수 있어야합니다

<label>Province</label> 
<select name="province"> 
<option value="ontario">Ontario</option> 
<option value="quebec">Quebec</option> 
<option value="novascotia">Nova Scotia</option> 
</select> 

<label>city</label> 
<select name="city"> 
</select> 

. 나는 이것을 jQuery 또는 Ajax없이없이해야만한다. 참고 자바 스크립트 배열 변수가 얼마나 오래 모든 데이터를 보유해야하는지는 중요하지 않습니다. 나는 그저 대본으로 나를 시작하는 누군가가 필요해.

Answer 1

here's a quick sample 최적화되지 않았지만 작업을 수행합니다. 말하듯이 jQuery도없고 AJAX도 없습니다. 이 하나의 표준 준수 브라우저에서 작동, 당신은 사람이 필요 IE IE에 대한 테스트를 IE가 없어.

<label>Province</label> 
<select id="province"> 
    <option value="p1">p1</option> 
    <option value="p2">p2</option> 
    <option value="p3">p3</option> 
</select> 

<label>city</label> 
    <select id="city"> 
</select> ​ 


window.onload = (function() { 

    var locations = { 
     'p1': [ 
      'p1c1', 
      'p1c2', 
      'p1c3', 
      ], 
     'p2': [ 
      'p2c1', 
      'p2c2', 
      'p2c3', 
      ], 
     'p3': [ 
      'p3c1', 
      'p3c2', 
      'p3c3', 
      ], 
    }; 

    var provinces = document.getElementById('province'); 
    var cities = document.getElementById('city'); 

    provinces.addEventListener('change', function() { 
     loadCities(this.value) 
    }, false) 


    var loadCities = (function loadCitiesFunc(key) { 
     key = key || 'p1'; 
     var docFragment = document.createElement('select'); 
     for (var i = 0; i < locations[key].length; i++) { 
      docFragment.appendChild(new Option(locations[key][i], locations[key][i])); 
     } 
     cities.innerHTML = docFragment.innerHTML; 

     return loadCitiesFunc; 
    }()) 

}());​