jQuery提交数据不刷新

Question

这是这样做的最好方法...
我有一些下拉，当用户选择一个选项，我选择他们的选择，并将其发送到PHP页面查询数据库，然后返回该数据一个div ...

代码如下

<?PHP 
    include('includes/inc_header.php'); 

    #<-- SQL QUERIES START -------------------------------------------> 
    $sql1 = "SELECT Team.ShortLabel ShortLabel,Team.Label Label 
      FROM adlTeam Team 
      INNER JOIN adlPlanet Planet ON Team.TeamKey = Planet.TeamKey 
      GROUP BY ShortLabel"; 
    $queryrow1 = mysql_query($sql1);    
    #<-- SQL QUERIES END -------------------------------------------> 
?> 

<script type="text/javascript"> 
    $(document).ready(function() 
    { 
    $("#selectOwner").change(function() 
    {  
     $.post('process.php', $(this).serialize() 
     ,function(data){$("#ownerInfo").html(data)}); 

     return false; 
    });  
$("#selectZoom").change(function() 
    {  
     $.post('zoomchange.php', $(this).serialize() 
     ,function(data) 
     { 
     $("#mapchanges").html(data) 
     }); 
     return false; 
    }); 
    $("#nameStatus").change(function() 
    {  
     $.post('mapchanges.php', $(this).serialize(), function(data) 
     { 
     $("#zoomchanges").html(data) 
     }); 
     return false; 
    });   
    }); 
</script> 

<div id="primary_content"> 

    <form name="myform" id="myform" action="" method="POST"> 
    <h3>SELECT TEAM</h3> 
    <select name="selectOwner" id="selectOwner" size="10" 
     style = "width:250px;margin-top:-12px;margin-left:15px;"> 
    <?PHP 
     while ($clanlist = mysql_fetch_array($queryrow1)) 
     { 

     #<-- SQL QUERIES START -------> 
     $sql3 = "SELECT Red, Green, Blue FROM adlteam 
        WHERE ShortLabel = '".$clanlist['ShortLabel']."'"; 
     $queryrow3 = mysql_query($sql3); 
     $colors = mysql_fetch_array($queryrow3);  
    #<-- SQL QUERIES END ------------> 

    ?> 
<option id="ownerID_input" name="ownerID" 
     value="<?php 
     echo $clanlist['ShortLabel']; ?>"><?php echo $clanlist['Label']; ?> 
    </option> 
<?PHP 
     } 
    ?> 
</select> 
</form> 

<div id="ownerInfo"></div> 
<div id="planetInfo"></div> 
<div id="mapchanges"></div> 
<div id="zoomchanges"></div> 
<div id="mapoptions"> 
    <span class="h4">ZOOM:</span> 
    <select name="selectZoom" id="selectZoom"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
    <option value="6">6</option> 
    <option value="7">7</option> 
    <option value="8">8</option> 
    <option value="9">9</option> 
    <option value="10">10</option> 
    <option value="11">11</option> 
    <option value="12">12</option> 
    <option value="13">13</option> 
    <option value="14">14</option> 
    <option value="15">15</option> 
    <option value="16">16</option> 
    <option value="17">17</option> 
    <option value="18">18</option> 
    <option value="19">19</option> 
    <option value="20">20</option> 
    </select> 
    <input type="checkbox" style="margin-top:10px;" 
     name="nameStatus" id="nameStatus"> 
     <span class="pinfo">Planet Names</span> 
</div> 

</div> 
<div id="secondary_content"> 
    <iframe src="mapgendisplay.html" name="testFrame" id="testFrame" 
     width="695" height="564" scrolling="no" 
     frameborder="0" allowtransparency></iframe> 
    </div> 
<?PHP include('includes/inc_footer.php'); ?> 

Answer 1

从我所看到的，看起来像是在做你想要做什么的一个好办法。更多的信息将是有用的，但。

这是可能的，你可以通过使功能更普遍减少代码：

var phpfile = new Array(); 
phpfile["selectZoom"] = "zoomchange.php"; 
... 
... 

var elementID = new Array(); 
elementID["selectZoom"] = "#mapchanges"; 
... 
... 

$("select").change(function() { 
    $.post(
    phpfile[$(this).id()], 
    $(this).serialize(), 
    function(data) { 
     $(elementID[$(this).id()]).html(data) 
    } 
); 
});