选择列表更改的按钮href无法解析（javascript：window.open（window.variable））

Question

我正在使用javascript根据用户从选择列表中的选择成功更改按钮的href。 但是，href值是一个javascript变量，在我的代码更改它后无法解析。

这是代码：

 var clickTag1 = "http://www.myexampledomain.com/test-1"; var clickTag2 = "http://www.myexampledomain.com/test-2"; var clickTag3 = "http://www.myexampledomain.com/test-3"; var clickTag4 = "http://www.myexampledomain.com/test-4"; (function() { var form = document.forms['swiftForm']; //document.getElementById('cT_target').href = 'javascript:window.open(window.' + this.value + ')'; var trigger = document.getElementById('cT_toggle'); trigger.onchange = function() { var link = document.getElementById('cT_target'); link.href = 'javascript:window.open(window.' + this.value + ')'; } })(); 

 <form id="swiftForm"> <div class="styledSelect"> <select name="cT_toggle" id="cT_toggle"> <option value="clicktag1">2 meters</option> <option value="clicktag2">4 meters</option> <option value="clicktag3">6 meters</option> <option value="clicktag4">8 meters</option> </select> </div> <div class="swiftSubmit"> <a id="cT_target" href="javascript:window.open(window.clickTag1)">Calculate</a> </div> </form> 

页面加载后，按钮href会按预期工作（打开一个包含目标clickTag URL的新窗口）。 但是，通过从选择列表中选择一个新值更改href以后，href不再打开目标clickTag URL，而只是打开一个空窗口。

问题似乎是由于在页面HTML中更改了javascript变量值（clickTag）之后不再对其进行评估。

我想知道我是否缺少一些技巧？

Answer 1

更改<select>元素中的值以匹配变量名。

HTML：

<select name="cT_toggle" id="cT_toggle">
    <option value="clickTag1">2 meters</option>
    <option value="clickTag2">4 meters</option>
    <option value="clickTag3">6 meters</option>
    <option value="clickTag4">8 meters</option>
</select>

Answer 2

Javascript区分大小写，select的值应与变量名匹配

更改

<select name="cT_toggle" id="cT_toggle">
    <option value="clicktag1">2 meters</option>
    <option value="clicktag2">4 meters</option>
    <option value="clicktag3">6 meters</option>
    <option value="clicktag4">8 meters</option>
</select>

至

<select name="cT_toggle" id="cT_toggle">
    <option value="clickTag1">2 meters</option>
    <option value="clickTag2">4 meters</option>
    <option value="clickTag3">6 meters</option>
    <option value="clickTag4">8 meters</option>
</select>

Answer 3

最好的方法不是在C_Toggle上执行onchange操作，而是在链接上激发一个函数，该函数将根据所选的C_Toggle值来重定向文档。