layui 请求后台 josn数据

layui 点击请求json后台数据

以input 开关切换为例 所有表单元素切换同理 又不同方案请各位大佬指教

<form class="layui-form">
    <div class="layui-form-item">
      <label class="layui-form-label">开关开</label>
      <div class="layui-input-block">
        <input type="checkbox" lay-skin="switch">
      </div>
    </div>
    <div id="test">
      <div id="ttt"></div>
    </div>
  </form>
  <script src="layui-v2.5.5/layui/layui.js"></script>
  <script>
    layui.use(['form', 'table'], *function* () {
      *var* form = layui.form;
      // 可以直接引入jq
      *var* $ = layui.jquery;
      // 监听事件
      form.on('switch()', *function* (*e*) {
       // 获取当前点击标签属性
        console.log(e)
        console.log(e.elem)
        var state = e.elem.checked;
        // 判断input的状态
        if (state == true){          $.getJSON('https://cnodejs.org/api/v1/topic/5433d5e4e737cbe96dcef312', function(data) {      
             $.each(data,*function*(){
                *console*.log(data)
                // 模板字符串渲染
                *var* Str2 = `     
                        <ul>
                           <li>${data.data.title}</li>
                           <li>${data.data.content}</li>
                       </ul>
                  `;
                $("#test").html(Str2);
           })
          });

        }else{

           $("#test").empty()

        }

      });

    })
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章