在下拉菜單中設置函數onchange - PHP

我有一個下拉列表，當用戶選擇一個值和不同的窗體將出現取決於選擇的值。我的文件在html中。我爲我的設計使用bootstrap。在下拉菜單中設置函數onchange - PHP

這裏是我的示例代碼：

<form name="exmType" method = "POST"> 
<select class="form-control" name="txtType" class="select" method = "post" 
onChange="this.form.submit();" style="width:300px;"> 
    <option value="">Option A</option> 
    <option value="1">Option B</option> 
    <option value="2">Option C </option>  
<?php 

if (isset($_POST['txtType'])) { 
if ($_POST['txtType'] == ""){ 
     *display form a* 
} elseif ($_POST['txtType'] == 1){ 
     *display form b* 
} elseif ($_POST['txtType'] == 2){ 
     *display form c* 
} 
} 

?> 

    </select> 
</form>

來源

2015-06-21 maecy m

** this.form.submit **什麼形式？ – 2015-06-21 06:45:27

爲什麼使用jQuery來根據select元素的值來鉤住顯示錶單的事件？它更簡單。 – odedta

@odedta我對jQuery並不十分熟悉，我暫時還沒有編寫代碼，此刻我仍然迷失了方向。 –

下面是一個簡單的代碼示例，你需要什麼，你可以用它撥弄你的需求。

該代碼非常簡單，所以如果您在發表評論時有任何問題，我都沒有理由詳細說明它的功能。

$(document).ready(function() { 
 
    $('select').change(function(){ 
 
     if($(this).val() == '0') { 
 
      $('form').css('display','none'); 
 
     } 
 
     if ($(this).val() == '1') { 
 
      $('form').css('display','none'); 
 
      $('#form_a').css('display','block'); 
 
     } 
 
     if($(this).val() == '2') { 
 
      $('form').css('display','none'); 
 
      $('#form_b').css('display','block'); 
 
     } 
 
     if($(this).val() == '3') { 
 
      $('form').css('display','none'); 
 
      $('#form_c').css('display','block'); 
 
     } 
 
    }); 
 
});

form { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select> 
 
    <option value="0">-- Choose Form --</option> 
 
    <option value="1">Form A</option> 
 
    <option value="2">Form B</option> 
 
    <option value="3">Form C</option> 
 
</select> 
 
<form id="form_a" method="post" role="form"> 
 
    Form a: <input type="text" value="form_a_text"/> 
 
</form> 
 
<form id="form_b" method="post" role="form"> 
 
    Form b: <input type="text" value="form_b_text"/> 
 
</form> 
 
<form id="form_c" method="post" role="form"> 
 
    Form c: <input type="text" value="form_c_text"/> 
 
</form>

所有選擇標籤

來源

2015-06-21 07:01:46 odedta

這是一個很好的例子。儘管我仍在處理我的代碼。感謝您的幫助 –

乾杯！如果你有任何問題只是發表評論:) – odedta

我不得不承認，起初我不知道我應該怎樣做你給我的例子，花了我幾次重新讀你的代碼，以最終了解它。我現在的代碼工作正常。：D –

你應該嘗試使用jQuery：

<script> 
$('form select[name=txtType]').change(function(){ 
    if ($('form select option:selected').val() == '1'){ 
    $('#optionA').show(); 
    }else{ 
    $('#optionA').hide(); 
    } 
}); 

$('form select[name= txtType]').change(function(){ 
    if ($('form select option:selected').val() == '2'){ 
    $('#optionB').show(); 
    }else{ 
    $('#optionB ').hide(); 
    } 
}); 
</script>

你可以找到Jquery的：http://jsfiddle.net/ecZrE/

一些很好的答案： Show Form Field if Drop Down Item is Selected Using jquery

Javascript: Trying to show different forms based on drop down value?

Drop down menu selection ditactes what form will display

Show different elements of a form depending on dropdown box selection

來源

2015-06-21 07:00:58

首先有兩個class=。選擇正確的一個。

`<select class="form-control"  name="txtType" class="select" method =  "post" 
    onChange="this.form.submit();"   style="width:300px;"> 
<option value="">Option A</option> 
<option value="1">Option B</option> 
<option value="2">Option C </option>`

要添加onClick或onChange事件，請使用下面的函數。在添加之前，如果您將id添加到選擇標記中會更好。

$('#select_tag_id').change(function(){ $('#form_id_to_display').show('slow'); $('#form_id_to_hide').hide('slow'); });

添加上述代碼在頭部分或頁面的鈕。

對錯對齊。從手機發布。編輯選項有限。

來源

2015-06-21 07:04:22

在下拉菜單中設置函數onchange - PHP

回答

相關問題