我基於下拉選項創建了自動填充輸入字段。我的問題是第二個選擇框沒有填充相應的輸入字段。我知道這是錯誤的,因爲ID與select1是一樣的,但我怎麼能使它工作?我需要創建大約20個或更多的選擇下拉列表,我無法弄清楚如何解決它。根據下拉選項自動填充輸入字段
$('#coursecode').change(function() {
var myValue = $(this).val();
var myText = $("#coursecode :selected").text();
if (myText != '' && myText === "11111") {
$("#coursename").val("Web Dev");
$("#prerequesite").val("None");
$("#units").val("3");
}
else if (myText != '' && myText === "22222") {
$("#coursename").val("Math");
$("#prerequesite").val("None");
$("#units").val("3");
}
else if (myText != '' && myText === "33333") {
$("#coursename").val("English");
$("#prerequesite").val("None");
$("#units").val("3");
}
else if (myText != '' && myText === "44444") {
$("#coursename").val("Psychology");
$("#prerequesite").val("None");
$("#units").val("3");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="select1">
<select id="coursecode" name="coursecode">
<option value="">Please select...</option>
<option value="1">11111</option>
<option value="2">22222</option>
<option value="3">33333</option>
<option value="4">44444</option>
</select>
<input type="text" id="coursename" name="coursename" value="" readonly>
<input type="text" id="prerequesite" name="prerequesite" value="" readonly>
<input type="text" id="units" name="units" value="" readonly>
</div>
<div class="select2">
<select id="coursecode" name="coursecode">
<option value="">Please select...</option>
<option value="1">11111</option>
<option value="2">22222</option>
<option value="3">33333</option>
<option value="4">44444</option>
</select>
<input type="text" id="coursename" name="coursename" value="" readonly>
<input type="text" id="prerequesite" name="prerequesite" value="" readonly>
<input type="text" id="units" name="units" value="" readonly>
</div>
他們要成爲同當第二選擇的變化會是怎樣的邏輯 –
的想法是選擇多個coursecodes。例如,新學員正在註冊,他需要10個科目才能報名。然後,他需要選擇10個課程代碼,信息應該自動填充。我只是使用了下拉式和自動填充功能,因此學生不必手動輸入所有數據。 – WEREBER