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

jQuery提交数据不刷新

1 个答案: