关于一个预约系统怎么用jq实现

[LHN_hpu]

老师要我做一个预约的系统
前端的图是这样的

然后我想点击一个按钮然后可以对数据库写入预约
但是<input type="button" value="预约">这个button怎么通过jq传值到表单处理然后写入数据库呢？
源代码如下：

 <form action="#" method="post">
      <table cellpadding="3" cellspacing="1" border="1" width="50%" class="tableBorder" align=center>
         <tr>
            <td>星期</td>
            <td>上午</td>
            <td>下午</td>
         </tr>
         <tr>
            <td>一</td>
            <td><input type="button" value="预约" /></td>
            <td><input type="button" value="预约" /></td>
         </tr>
         <tr>
            <td>二</td>
            <td><input type="button" value="预约" /></td>
            <td><input type="button" value="预约" /></td>
         </tr>
         <tr>
            <td>三</td>
            <td><input type="button" value="预约" /></td>
            <td><input type="button" value="已满" /></td>
         </tr>
         <tr>
            <td>四</td>
            <td><input type="button" value="已满" /></td>
            <td><input type="button" value="已满" /></td>
         </tr>
         <tr>
            <td>五</td>
            <td><input type="button" value="已满" /></td>
            <td><input type="button" value="已满" /></td>
         </tr>
         <tr>
            <td>六</td>
            <td><input type="button" value="已满" /></td>
            <td><input type="button" value="已满" /></td>
         </tr>
         <tr>
            <td>日</td>
            <td><input type="button" value="预约" /></td>
            <td><input type="button" value="预约" /></td>
         </tr>
      </table> 
      </form>

还有就是我用的thinkphp做的，也是边学边做，因为是菜鸟，求大神指教

[LB228988]

ajax代码实现：
$(document).ready(function(){
       $..ajax({
            url:"你的服务端处理地址，假设b.php",
             data:"你的数据",
            async:false,//是否同步
            datatype:"返回数据类型（xml，json，text）",
           success:function(msg){
           //你的前端逻辑
         },
          error:function(msg){
              //你的前端逻辑
         }
   });
});


b.php
获取数据，插入数据库...............................

[xuzuning]

楼主要求的是 用jq实现，所以就给个 jq 的测试例，至于 php 收到数据后如何操作，已不在讨论的范围了

<?php
if($_POST) {
  print_r($_POST);
  exit;
}
?>
<script src=scripts/jquery-1.8.3.min.js></script>
<script>
$(function() {
  $(':button').click(function() {
    var data = {};
    var that = $(this).parents('td')[0];
    $(this).parents('tr').find('td').each(function(i, tag) {
      if(i == 0) data['week'] = $(this).text();
      if(that == this) data['time'] = i == 1 ? 'pm' : 'am';
    });
    var url = location.href;
    var url = $(this).parents('form').attr('action'); //需将 action="#" 改为 action="?" 或实际的 url
    $.post(url, data, function(d) {
      alert(d);
    });
  });
})
</script>
 <form action="?" method="post">
      <table cellpadding="3" cellspacing="1" border="1" width="50%" class="tableBorder" align=center>
         <tr>
            <td>星期</td>
            <td>上午</td>
            <td>下午</td>
         </tr>
         <tr>
            <td>一</td>
            <td><input type="button" value="预约" /></td>
            <td><input type="button" value="预约" /></td>
         </tr>
         <tr>
            <td>二</td>
            <td><input type="button" value="预约" /></td>
            <td><input type="button" value="预约" /></td>
         </tr>
         <tr>
            <td>三</td>
            <td><input type="button" value="预约" /></td>
            <td><input type="button" value="已满" /></td>
         </tr>
         <tr>
            <td>四</td>
            <td><input type="button" value="已满" /></td>
            <td><input type="button" value="已满" /></td>
         </tr>
         <tr>
            <td>五</td>
            <td><input type="button" value="已满" /></td>
            <td><input type="button" value="已满" /></td>
         </tr>
         <tr>
            <td>六</td>
            <td><input type="button" value="已满" /></td>
            <td><input type="button" value="已满" /></td>
         </tr>
         <tr>
            <td>日</td>
            <td><input type="button" value="预约" /></td>
            <td><input type="button" value="预约" /></td>
         </tr>
      </table> 
      </form>

[断点Bingo]

要用ajax才能进行数据通信

[智商众筹]

<input type="button" value="预约" /> 比如这是星期一上午的按钮，那么给他加2个属性 a="1" b="上午" 再给按钮绑定click事件，运行一个自定义函数 onclick="fn(this)" 函数fn里用$(this).attr('a')获取到星期几和上下午，将这些参数打包成一个对象 然后用$.post发送到php 具体用法有不明白的百度吧

[mengfk000]

预约用按钮，已满就别再用按钮了。点击预约就用ajax把日期提交到后台