欢迎来到我的资源网!
阿里云推广
阿里云推广

迅睿CMS

当前位置:首页 > CMS教程 > 迅睿CMS >

迅睿CMSselect联动效果,地区联动

时间:2024-04-19 17:32:42|栏目:迅睿CMS|点击:0

纯js写法,直接分享代码


自定义联动select分享

<table border="0" cellspacing="0" cellpadding="0" style=" width:400px; margin:150px auto;color:#FFFFFF; font-size:18px;">
  <tr>
    <td colspan="2" align="center" style="line-height:80px; font-size:30px;">查询你身边的专业机构</td>
  </tr>
  <tr>
    <td width="73" height="30">省份:</td>
    <td width="327"><select size="1" onchange="usu_select_city(this.value)" style="width:300px; height:30px;">
      <option>--</option>
     {linkage code=ceshi pid=0}
  <option value="{$t.ii}">{$t.name}</option>
  {/linkage}
    </select></td>
  </tr>
  <tr>
    <td height="20">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>城市:</td>
    <td><select id="usu_city" size="1"  style="width:300px; height:30px;">
     
    </select></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>

</table>

以下是业务js代码:

<script src="{THEME_PATH}assets/global/plugins/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
 function usu_select_city(pid) {
  $("#usu_city").html('');
  $.ajax({
   url: "/index.php?s=api&c=api&m=linkage_ld&mid=news&file=&code=address&parent_id="+pid,  // 发送的路径
   type: "get",  // 发送方式
   dataType: 'JSON',  // 反序列化
   success: (res) => {  // 成功获取到后端返回结果的回调函数
    if (res.data.length > 0) {
     $.each(res.data,function(index,value){
      $("#usu_city").append('<option value="'+value.region_id+'">'+value.region_name+'</option>');
     });
    }
   },
   error:()=>{  // 发送失败的回调函数
    console.log("失败");
   }
  })
 }
 </script>

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:1435567186 | 邮箱:admin@wqjdym.top

Copyright © 2016-2025我的资源网 版权所有 鲁ICP备18026231号-3