javascript/jquery : select 태그에있는 모든 옵션 요소의 텍스트 목록 만들기

Question

Django 웹 개발 플랫폼에서 작업 중이므로 내 메뉴를 만드는 데 장고 템플릿 언어를 사용합니다. 내 작업은 간단하지만 js와 작업한지 얼마되지 않아 지금 당황하고있는 것이 무엇인지 잘 모르겠습니다.

각 옵션 요소의 텍스트에 대한 문자열 목록을 만들거나 value 속성의 캐릭터 라인 하지만 지금, 아무것도 선택 태그

<div id="keywordCollection"> 
    <select id="#allKeywords"> 
    {% for keyword in keywords %} 
    <option value="{{ keyword }}">{{ keyword }}</option> 
    {% endfor %} 
    </select> 

자바 스크립트 (이것은 HTML 파일에서 인라인 스크립트는이 웹을위한주의

... 이상 반복 받고있는 것으로 보인다 페이지 바로 위에 표시됩니다.)

<script> 
    var collection = [] 
    $("#allkeywords option").each(function() { 
    //This never begins running. 
    console.log("ADDING"); 
    collection.push($(this).value); 
    }); 
    $(function(){ 
    var collection = []; 
    var keywords = $("#allKeywords option"); 
    for(var i=0; i<keywords.length; i++) { 
     // This doesn't ever begin running, keywords.length == 0. 
     kw = keyword[i]; 
     console.log(kw); 
    } 
    $("#allKeywords option").each(function() { 
    //this doesn't ever begin running. 
    collection.push($(this).value); 
    }); 
    .... //irrelevant code that I cut out. 
}); 
</script> 

내 루프가 시작됩니다. 이 시점에서 내 요소가 실제로 그 안에 어떤 요소가 있는지 궁금해 할 것입니다 ... 그렇습니다. 그 장고 for-loop 메뉴를 채우고 내 페이지에서 바로 볼 수 있습니다.

무엇이 여기에 있습니까?

Answer 1

당신의 선택 태그의 id 매개 변수에 '#'를 제거

<select id="allKeywords"> 
    {% for keyword in keywords %} 
    <option value="{{ keyword }}">{{ keyword }}</option> 
    {% endfor %} 
</select> 

그 방법은 아래의 선택은 작동합니다 :

$("#allkeywords option").each(function() { 
    // ... 
}