PHP Jquery onchange 事件答案

【问题标题】：PHP Jquery onchange eventPHP Jquery onchange 事件
【发布时间】：2013-04-18 07:12:25
【问题描述】：

我在表单中有一个带有过滤器的选择框，如何使用 jquery 替换 onchange 事件以避免整个页面刷新？我希望某些 div 块能够在选择某些选项时重新加载回调数据。

<form name="form_filter" action="<?php echo $_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING'].'#network-programs' ?>" method="post" enctype="multipart/form-data">
Genre:
<select name="filterGenre" id="filterGenre" onchange="this.form.submit()"  >
<option value="all" selected="selected">All</option>
<?php
$query1 = "SELECT * FROM video WHERE vcat_id IN(SELECT category_id FROM categories WHERE video_id IN(SELECT vid FROM `video` WHERE vuser_id='8') AND main_cat=1)";
$result = mysql_query($query1);

while($row = mysql_fetch_assoc($result)) {
    $vcat_id = stripslashes($row['vcat_id']);
    $vcat_name = stripslashes($row['vcat_name']);

    echo "<option value='".$vcat_id."'"; 
    if($vcat_id == $_POST['filterGenre']){echo ' selected ';}
    echo ">".$vcat_name."</option>";
}
?>
</select>

</form>

请指教，谢谢。

【问题讨论】：

ajax 会为你做的

标签： php jquery onchange

【解决方案1】：

$(document).ready(function(){

$('#filterGenre').change(function(){

$.ajax({
      url   : your form action,
      data  : $('#your form id').serialize(),
      type : 'POST',
      success : function(data){
                      $('#yourdiv').html(data);
                  }

  })

})

})

从选择中移除 onchange

【讨论】：

它的 html() 执行这个......它处理 html 元素的内部内容.. api.jquery.com/html

【解决方案2】：

您可以将 AJAX 与 jquery 一起使用。

w3schools

【讨论】：

【解决方案3】：

你可以这样写：

<form id='form' ...
   <select name="filterGenre" id="filterGenre" onchange="send_it()" ...
   ...

<script>
   function send_it(){
                      $.ajax({
                         type: 'GET',
                         url: 'http://www.site.com/page.php',
                         data: $('#form').serialize(),
                         success: function(){
                            alert('done!');
                         }
                      });
   }
</script>

【讨论】：