plugs.pcasunzip.html 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. {extend name='extra@admin/content'}
  2. {block name="content"}
  3. <div class="code">
  4. <blockquote class="site-text layui-elem-quote">
  5. PCAS 单文件JS省市区插件(也适用于Wap端)
  6. </blockquote>
  7. <div id="demo" class="citys">
  8. <div class="layui-input-inline">
  9. <select class="layui-select" name="province"></select>
  10. </div>
  11. <div class="layui-input-inline">
  12. <select class="layui-select" name="city"></select>
  13. </div>
  14. <div class="layui-input-inline">
  15. <select class="layui-select" name="area"></select>
  16. </div>
  17. </div>
  18. <pre class="layui-code" lay-title="HTML代码">
  19. <div class="citys">
  20. <div class="layui-input-inline">
  21. <select class="layui-select" name="province"></select>
  22. </div>
  23. <div class="layui-input-inline">
  24. <select class="layui-select" name="city"></select>
  25. </div>
  26. <div class="layui-input-inline">
  27. <select class="layui-select" name="area"></select>
  28. </div>
  29. </div>
  30. </pre>
  31. <pre class="layui-code" lay-title="javascript代码">
  32. require(['pcasunzips'], function () {
  33. /** // 省市联动
  34. * new PCAS("Province","City")
  35. * new PCAS("Province","City","吉林省")
  36. * new PCAS("Province","City","吉林省","吉林市")
  37. * // 省市地区联动
  38. * new PCAS("Province","City","Area")
  39. * new PCAS("Province","City","Area","吉林省")
  40. * new PCAS("Province","City","Area","吉林省","松原市")
  41. * new PCAS("Province","City","Area","吉林省","松原市","宁江区")
  42. * // 省、市、地区对象取得的值均为实际值。
  43. * // 注:省、市、地区提示信息选项的值为""(空字符串)
  44. */
  45. // 实例化PCAS插件
  46. new PCAS('province', 'city', 'area', '广东省', '广州市', '海珠区');
  47. });
  48. </pre>
  49. <script>
  50. require(['pcasunzips'], function () {
  51. new PCAS('province', 'city', 'area', '广东省', '广州市', '海珠区');
  52. });
  53. </script>
  54. </div>
  55. <script>
  56. layui.use('code', function () {
  57. layui.code({
  58. encode: true
  59. });
  60. });
  61. </script>
  62. {/block}