利用cache+jquery实现多级联动

发布时间:2020-06-10 18:44:58 作者:iege
来源:网络 阅读:331

第一步:产生cache

//缓存一级目录
$sql="SELECT id,name from ".DB_TABLEPRE."city where pid=0001";//直辖市,省
$plist=$db->fetch_all($sql);
write_to_file('provice',$plist);

用到的write_to_file();

//将字符串写进文件
function write_to_file($cachename,$content = '') {
    if (is_array($content)) {
        $content = "\$_CACHE['$cachename'] = ".var_export($content,True).';';
    }
    $content = "<?php\n//该文件是系统自动生成的缓存文件,请勿修改\n//创建时间:".get_date('Y-m-d H:i:s',time())."\n\nif (!defined('IN_TOA')) {exit('Access Denied!');}\n\n".$content."\n\n?>";
    $filename = CACHE_ROOT.'cache_'.$cachename.'.php';
    $len = file_put_contents($filename, $content);
    @chmod($filename, 0777);
    return $len;
}

模板中的位置

<dl>
       <dt>地区(*):</dt>
       <dd><select name="provice">
       <?php foreach($_CACHE['provice'] as $p){?>
       <option value="<?php echo $p['id']?>"><?php echo $p['name']?></option>
       <?php }?>
       </select><span id="c"></span><span id="t"></span></dd>
   </dl>

调用的js

//list tow
function tlist(){
    //动态查询城市地区列表
  $('select[name=city]').change(function(){
      var c=$(this).val();
      $.get('inc/json_city.php?name=town&id='+c,function(data,status){
          $('#t').html(data);
      });
  });
}

json_city文件

<?php
//获取城市list
include_once('../include/common.php');
$id=getGP('id','G','int');
$name=getGP('name','G');//列表名称
//query
$sql="SELECT id,name FROM ".DB_TABLEPRE."city WHERE pid=".$id;
$list=$db->fetch_all($sql);
//循环
if($name=='city'){
    $str= "<select name='".$name."' onChange=\"tlist();\">";
}else{
     $str= "<select name='".$name."'>";
}
foreach($list as $l){
    $str.="<option value='".$l['id']."'>".$l['name']."</option>";
}
$str.="</select>";
echo $str;
?>

利用cache+jquery实现多级联动

推荐阅读:
  1. 微信小程序实现的picker多级联动功能示例
  2. 自己动手封装一个React Native多级联动

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

cache jquery ue

上一篇:go语言安装第三包的方式

下一篇:java中继承和接口有什么不同

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》