select onchange标记未运行我的Javascript函数

问题描述 投票:0回答:1

我有以下代码:

JS:

        function updateLink()
        {
                var selType = document.getElementByID("Types");
                var selLen = document.getElementByID("Length");
                var selLoc = document.getElementByID("Location");
                var selMan = document.getElementByID("Manufacturer");

                var test = document.getElementByID("test");
                test.innerHTML="Test";

                var selectedType = (selType.options[selType.selectedIndex].text);
                var selectedLength = (selLen.options[selLen.selectedIndex].text);
                var selectedLocation = (selLoc.options[selLoc.selectedIndex].text);
                var selectedManufacturer = (selMan.options[selMan.selectedIndex].text);
                document.getElementById("apply").href="myURL?typeName="+selectedType+"length="+selectedLength+"location="+selectedLocation+"manufacturer="+selectedManufacturer;
        }
</script>

和HTML

 <div id="filterdiv" class="dark">
                <center><h3 id="test">Filters</h3></center>
                <br>
                <center>Type</center>
                <select id="Types" onchange="updateLink()">
                <option>All</option>
                {% for types in TypesList %}
                <option>{{types}}</option>
                {%endfor%}
                </select>
                <br>
                <br>

                <center>Inspection Period</center>
                <select id="Inspection Period">
                <option>All</option>
                {% for inspections in InspectionList %}
                <option>{{inspections}}</option>
                {%endfor%}
                </select>
                <br>
                <br>

                <center>Length</center>
                <select id="Length">
                <option>All</option>
                {% for lengths in LengthList %}
                <option>{{lengths}}</option>
                {%endfor%}
                </select>
                <br>
                <br>

                <center>Location</center>
                <select id="Location">
                <option>All</option>
                {% for locations in LocationList %}
                <option>{{locations}}</option>
                {%endfor%}
                </select>
                <br>
                <br>

                <center>Manufacturer</center>
                <select id="Manufacturer">
                <option>All</option>
                {% for manufacturers in ManufacturerList %}
                <option>{{manufacturers}}</option>
                {%endfor%}
                </select>


                <br>
                <br>
                <a href="" id="apply"><button onclick="updatelist()">Apply Filter (TODO)</button></a>
                <a href="http://myURL"><button>Reset Filters</button></a>

 </div>

这是选择框的列表,其中的选项取自我的Django模型,用于过滤另一个div中的列表。按下我的按钮后,我将重定向到相同的URL,未附加任何参数。我用来更改标题的测试字符串也没有任何改变。因此,我怀疑我的JS代码从未触发过。有人可以帮我吗?

我知道我的onchange仅适用于“类型”选择框。该代码不完整。我正在使用“类型”框进行测试。

myURL代替了我目前托管在其上的本地地址。

javascript html django html-select
1个回答
0
投票

替换此片段:

<br>
                <br>
                <a href="" id="apply"><button onclick="updatelist()">Apply Filter (TODO)</button></a>
                <a href="http://myURL"><button>Reset Filters</button></a>

this:

 <input type="button" value="Click me" onclick="updatelist()">
© www.soinside.com 2019 - 2024. All rights reserved.