使用选择选项没有刷新页面的加载div

我想在不刷新页面的情况下将表单的结果加载到div中。如果选择了一个选项，结果应该加载。通过选择选项提交没有页面刷新的表单，然后加载结果。这里是代码，我将如何使用jQuery与此使用选择选项没有刷新页面的加载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"; 
?>

来源

2011-07-15 user836910

我会给你答案，但我不想剥夺你的学习经验。在jQuery文档中查找.append（）。 – Ram

你想要的是AJAX，并且有关于这个网站上的东西的几个bajillion问题/答案。 –

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); 
     }); 
    }); 
});

来源

2011-07-15 20:53:57 Shef

append()将是你在找什么！确保您正在追加到正确的家长，并且您需要使用addClass()来设计您新创建的元素！祝你好运。

来源

2011-07-15 20:48:54 vinceh

使用选择选项没有刷新页面的加载div

回答

相关问题