python-Web-django-时间插件-三级联动

Posted 2022-07-20 person1-0-1

时间插件：

第一步：下载

https://www.layui.com/laydate/

下载插件包，放在项目的static

第二步：在html里引入js：

<script src="/static/laydate/laydate.js"></script> <!-- 时间插件 -->

引入标签：

<input type="text" placeholder="请选择日期" id="test1" name="time">

引入js块：

<script>
    //执行一个laydate实例
laydate.render(
  elem: ‘#test1‘, //指定元素
  type: ‘datetime‘
);
</script>

三级联动：

1.下载cxselect插件，放在static

2.建路由

 

3 建方法

def sanjiliandong(request):
    return render(request,‘app01_gbook.html‘)

4 建页面

在html引入外部js
<script type="text/javascript" src="/static/cxSelect/jquery.cxselect.min.js"></script>


在html中写标签：
<div id="city_china">
#   <legend>默认</legend>#

   <span>省份：<select class="province" name="province" data-value="" data-first-title="选择省" disabled="disabled"></select>
</span>
   <span>城市：<select class="city" name="city" data-value="" data-first-title="选择市" disabled="disabled"></select>
</span>
   <span>地区：<select class="area" name="area" data-value="" data-first-title="选择地区" disabled="disabled"></select>
</span>

</div>

在html中引入js块：
<script>
$(‘#city_china‘).cxSelect(
        url:‘/static/cxSelect/cityData.min.json‘,
        selects:[‘province‘,‘city‘,‘area‘],
        nodata:‘none‘
    );
</script>