Question

我正在撰写Formstack表单。我需要使用Javascript将下拉框的值更改为一旦匹配就输入文本字段的值。

<input type="text" id="field35497729" name="field35497729" size="50" value="" class="fsField">
<select id="field35497839" name="field35497839" size="1" class="fsField">
<option value="">&nbsp;</option>
<option value="CIPSmember">CIPSmember</option>
<option value="TECHCONNEXmember">TECHCONNEXmember</option>
<option value="TCBCpreferred">TCBCpreferred</option>
<option value="TCBCcomp2015">TCBCcomp2015</option>
</select>

因此，只要有人在CIPSmember中输入文本字段，就应该选择具有相同值的下拉列表。如果没有匹配，则下拉列表没有选择。

我在jsFiddle上使用了以下jQuery，但它不能用于Formstack：

$('#field35497729').keyup( function() {
$("#field35497839").val($('#field35497729').val()); 
}
);

这是我在jsFiddle上尝试的一种Javascript方法，它不起作用：

document.getElementByID('field35497729').onkeyup = function() {
document.getElementById('field35497839').value = document.getElementByID('field35497729').value;
};

我检查了here，here以及其他10个地方，但我无法让它工作。有很多关于如何在下拉选择更改时让文本字段更改的教程，但不是相反的几乎没有。

Answer 1

getElementById
缺少jQuery版本的结束括号
简化使用此和$（this）

然而，我很好奇。也许你想要一个autocomplete呢？

以下是您的固定版本

普通JS版

window.onload=function() {
    document.getElementById('field35497729').onkeyup = function() {
    document.getElementById('field35497839').value = this.value;
  }
}

<input type="text" id="field35497729" name="field35497729" size="50" value="" class="fsField">
<select id="field35497839" name="field35497839" size="1" class="fsField">
<option value="">&nbsp;</option>
<option value="CIPSmember">CIPSmember</option>
<option value="TECHCONNEXmember">TECHCONNEXmember</option>
<option value="TCBCpreferred">TCBCpreferred</option>
<option value="TCBCcomp2015">TCBCcomp2015</option>
</select>

jQuery版

$(function() {
  $('#field35497729').on("keyup",function() {
    $("#field35497839").val($(this).val()); // or (this.value)
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="field35497729" name="field35497729" size="50" value="" class="fsField">
    <select id="field35497839" name="field35497839" size="1" class="fsField">
    <option value="">&nbsp;</option>
    <option value="CIPSmember">CIPSmember</option>
    <option value="TECHCONNEXmember">TECHCONNEXmember</option>
    <option value="TCBCpreferred">TCBCpreferred</option>
    <option value="TCBCcomp2015">TCBCcomp2015</option>
    </select>

当文本字段的值发生变化时，需要JavaScript等效于jQuery更改下拉列表的值

1 个答案: