選択オプションを使用してページをリフレッシュせずにdivをロードする

Question

ページを更新せずにフォームの結果をdivにロードしたいと考えています。オプションが選択されている場合は、結果がロードされます。オプションを選択すると、ページをリフレッシュせずにフォームが送信され、結果がロードされます。ここで私はあなたが探しているものだろう。この

<form name="form" action="show.php" method="GET"> 
<select name="school" > 
<option value="">School</option> 
<option value="1">St.Peter</option> 
<option value="2">JHS</option> 
</select> 
<input type="submit" name="Submit" value="Search" > 
</form> 

<?php 
$s = $_GET['school']; 
if($q && ($s =='1')){echo "St.peter H.S";} 
elseif($q && ($s=='2')){echo "JHS";} 
else echo "Enter something"; 
?> 

Answer 1

HTML：

<form name="form" action="show.php" method="GET"> 
<select name="school" > 
<option value="">School</option> 
<option value="1">St.Peter</option> 
<option value="2">JHS</option> 
</select> 
<input type="submit" name="Submit" value="Search" > 
</form> 
<div id="result"></div> 

PHP：

<?php 
$s = $_GET['school']; 
if($q && ($s =='1')){echo "St.peter H.S";} 
elseif($q && ($s=='2')){echo "JHS";} 
else echo "Enter something"; 
?> 

のjQuery：

$(document).ready(function(){ 

    $('select[name="school"]').change(function(){ 
     $.get('show.php', {school : $(this).val()}, function(data){ 
      // use .append(data), if you don't want to remove the previous content 
      $('#result').html(data); 
     }); 
    }); 
}); 

Answer 2

append()でjqueryのを使用する方法のコードは、です！適切な親に追加していることを確認してください。addClass()を使用して、新しく作成した要素のスタイルを設定してください。がんばろう。