2

私は 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メソッドの1つを次に示します。

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

私はここ、ここ、そしておそらく他の10か所をチェックしましたが、うまくいきません。ドロップダウンの選択が変更されたときにテキスト フィールドを変更する方法に関するチュートリアルはたくさんありますが、その反対のチュートリアルはほとんどありません。

4

1 に答える 1

2
  • getElementByIdのスペルミスのある ID
  • jQuery バージョンの終了ブラケットの欠落
  • this と $(this) を使用するように簡略化

しかし、私は興味があります。おそらく、代わりにオートコンプリートが必要ですか?

ここにあなたの固定バージョンがあります

プレーン 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>

于 2015-09-01T07:04:05.860 に答える