根據從下拉列表中選擇的值顯示表單

Question

我的程序要填寫兩種形式。 我只想在選擇值表單下拉列表后顯示每個表單。 我嘗試了很多次，但沒有成功。 我不是一個編程人員。 我也需要從下拉列表中選擇的值，即使重新加載頁面后也要保留。因此，如果有人可以幫助我使用php，javascript或jquery解決此問題，我將非常高興。

Answer 1

您的某些代碼會有所幫助。 但這也許會為您指明正確的方向（使用jQuery）：

<select name="formType" id="formType">
    <option value="Type A">Type A</option>
    <option value="Type B">Type B</option>
</select>
...
<form id="formA">
    ...
</form>
<form id="formB">
    ...
</form>

<script type="text/javascript">
$(function() {//on document load
    $('#formA').hide();
    $('#formB').hide();
    $('#formType').change(function(){
        showForm($(this).val());
    });

});

function showForm(myFormType){
    if(myFormType == 'Type A'){
        $('#formA').show();
    }
    else{
        $('#formB').show();
    }
}
</script>

Answer 2

解決方案取決於您是否要在頁面上同時擁有兩個表單，並且顯示的表單會根據選擇而改變，或者是否要重新加載頁面以顯示正確的表單。

第一個解決方案是簡單的Javascript（在這種情況下為jQuery）：

$(document).ready(function () {
    $('.group').hide();
    $('#option1').show();
    $('#selectMe').change(function () {
        $('.group').hide();
        $('#'+$(this).val()).show();
    })
});

有關完整示例，請參見http://jsfiddle.net/eYzSb/ 。

第二種解決方案可以使用Ajax或PHP完成，稍后我將更新此答案。

Answer 3

<select>
<option value="" selected="selected"></option>
<option value="form_1">Form 1</option>
<option value="form_2">Form 2</option>
<option value="form_3">Form 3</option>
</select>

<form name="form_1" id="form_1" style="display:none">
<input type="text" value="1">
</form>

<form name="form_2" id="form_2" style="display:none">
<input type="text" value="2">
</form>

<form name="form_3" id="form_3" style="display:none">
<input type="text" value="3">
</form>

JS：

$("select").on("change", function() {    
    $("#" + $(this).val()).show().siblings().hide();
});

演示