querySelectAll不选择适当的元素

时间:2013-12-06 20:28:01

标签: javascript

我有一个带有很长ID的下拉菜单,但其中一部分是_Country。我有一个带有很长ID的文本框,但其中一部分是_State。

我正在尝试从下拉国家/地区获取值,并在有人选择国家/地区下拉列表中的选项时将其放入文本框状态。

这是我现在拥有的JavaScript。在我尝试使用通配符之前它工作正常,但现在它不起作用。

<script type="text/javascript">
document.querySelectorAll('[id*="_Country"]').onchange = replicate;
function replicate() {
    var tb1 = document.querySelectorAll('[id*="_Country"]');
    var tb2 = document.querySelectorAll('[id*="_State"]');
    tb2.value = tb1.value;
}
</script>

1 个答案:

答案 0 :(得分:3)

querySelectorAll()返回NodeList。使用querySelector()获取一个节点。

以下是一个示例(fiddle):

<select id="test_Country">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<select id="test_State">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<script>
    (function() {
        var country = document.querySelector('[id*="_Country"]');
        var state = document.querySelector('[id*="_State"]');
        country.addEventListener("change", function(e) {
            state.value = country.value;
        });
    })();
</script>