3. 郵遞區號地址

一、 TWzipcode官網：http://app.essoduke.org/twzipcode

1. 用途：可輸入郵遞區號，會自動生出縣市及鄉鎮市區，反之亦可。
2. 最新版為1.4.1有自動偵測功能，本例為1.3.1（有修改成可結合表單驗證程式），javascript部份設定（需先引入jquery）：

<script language='javascript' src='class/twzipcode-1.3.1.js'></script>
<script type='text/javascript'>
  $(document).ready(function() {
    $('#AddrForm').twzipcode({
      countyName: '縣市欄位的name',
      areaName: '鄉鎮市區欄位的name',
      zipName: '郵遞區號欄位的name',
      countySel: '$縣市預設值',
      areaSel: '$鄉鎮市區預設值',
      zipSel: '$郵遞區號預設值',
      zipReadonly: false
    });
  });
</script>

3. 表單部份：

<div style='position:relative;'>
 <span id='AddrForm'></span>
 <input type='text' name='addr' size='30' value='{$addr}' id='addr'>
</div>

二、 用選單切換內容

1. 利用下拉選單，選擇後，內容立即做出改變（不換頁）
2. 先處理一下表格，在要呈現內容的地方改為<tbody id='contact_list'></tbody>
3. 然後利用jquery的$.post()方法把相關內容給抓出來，並塞到contact_list中。

$('#menu2').change(function(){
    $.post('ajax.php' , {op: contact_list , gsn: $('#menu2').val()} , function(data){
        $('#contact_list').html(data);
    });
});

4. ajax.php裡可以根據op去執行相關函數，以抓出表格通訊錄內容。

$gsn=empty($_POST['gsn'])?0:$_POST['gsn'];
$op=empty($_POST['op'])?'':$_POST['op'];

switch($op){
    case "contact_list":
    echo contact_list($gsn);
    break;
}

function contact_list($gsn=''){
    //根據$gsn去資料庫撈出相關資料，基本上就是index.php的list_contact()函數內容
}

5. 一切換完選單就立即抓出資料：

$('#menu1').change(function(){
    $.post('ajax.php' , {parent_gsn: $('#menu1').val()} , function(data){
        $('#menu2').html(data);
        $.post('ajax.php' , {op: 'contact_list' , gsn: $('#menu2').val()} , function(data){
            $('#contact_list').html(data);
        });
    });
});