好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

对thinkphp框架编程中,ajax与php的响应过程讲解

对thinkphp框架编程中,ajax与php的响应过程讲解

今天的任务内容:将前台页面搜索结果中,不喜欢的内容(链接),删除掉,因为整个网站的编程框架式thinkphp,运用js中的ajax对页面进行响应,调用后台php接口,实现前台和后台数据库的同时更新.

首先我们需要做的就是在前台页面中添加一个文本[删除],可以这么添加:

<a href="javascript:void(0);" id= "<php>echo $val[id]</php>" class="delete" >删除</a>

上面的html代码的意思:就是给删除添加一个href,这个href是个js函数,类似于超链接的作用,当然对于我这样的新手在刚开始的时候会有疑惑,我们平时的超链接不是这样的,网页中很多的javascript:void(0),那程序怎么知道用户点击删除后,会响应其真正对应的js函数呢?别急,这就是为什么会为删除添加id以及class这样的标签,相信我把js中的代码公布出来以后你就会明白了,代码如下:

jQuery( ".list a.delete" ).click( function (){               if (confirm( "你确定要删除吗?" )){                   var  _this= this ;                   var  id = jQuery(_this).attr( "id" );                  jQuery.ajax({                      url :  '/Search/index.php/Jason/delete?' ,                      data : { 'id' :id},                      dataType :  'json' ,                      success :  function (data){                           var  del = data.del;                           if (del == 1){ //删除成功                               jQuery( "#" +id).parents( ".list" ).remove();                          } else { //删除失败                               alert( "删除失败" );                          }                      }                  });              }                  }); 

大家看函数的头部:jQuery(".list a.delete").click(),jQuery后面的标签是很重要的,这就保证了jquery很准确的响应页面中用户点击的[位置],添加的事件为click(),在click里添加响应事件的代码,var id = jQuery(_this).attr("id");获取a对应的id,因为这个id是我们删除数据库时用到的链接id,当然这种直接明文的方式不好,在这里只是介绍整个响应过程。调用ajax,实现异步的运行整个过程。我们设置了js接受的是json串,这里的方式应该有很多种吧,我没有去尝试,大家要是有兴趣可以自行尝试一下。/Search/index.php/Jason/delete?这句话就是js去请求php的接口,php接口对用的代码如下:

注意ajax在求php接口时的路径,也就是delete函数必须放在JasonAction.class.php中,此例子是必须这样的:

public   function   delete (){           if ($ this ->isGet()){              $userId = session( "uid" ); //用户登录                if (!empty($userId)){                  $a = M( '***' );                  $id = $ this ->_get( 'id' );                  $result=$a->where( "id=$id" )-> delete (); //删除                    if ($result > 0){                      $arr = array( "del" => '1' );                  } else {                      $arr = array( "del" => '0' );                  }                  $json_str = json_encode($arr);                  echo $json_str; //返回给js               }          }      } 

相信大家对上面的代码不会陌生吧,整个过程都是thinkphp框架内部配置完毕的.

var del = data.del;这句是接受php代码返回来的json串中del这个key的value,进而在前台进行页面更新和响应.

if (del == 1){ //删除成功        jQuery( "#" +id).parents( ".list" ).remove(); //这句话就是后台删除成功后,直接在前台对响应的div进行删除,这样性能就会很快,无需进行后台数据的重新提取至前台页面中,    } else { //删除失败        alert( "删除失败" );   } 

整个响应的过程就是这样,至于效果优化,是优化和细化方面的问题,后来,身边的同时又告诉我前台移除响应链接的另一个动态效果:

将:jQuery("#"+id).parents(".list").remove();替换为:

jQuery( "#" +id).parents( ".list" ).slideUp( "slow" ,  function (){        jQuery( this ).remove();  }); 

大家不妨试试效果,很不错的,好了,响应过程记载完毕,只是自己的个人见解和认知.

查看更多关于对thinkphp框架编程中,ajax与php的响应过程讲解的详细内容...

  阅读:40次