热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

解决使用layui对selectappend元素无效或者未及时更新的问题

今天小编就为大家分享一篇解决使用layui对selectappend元素无效或者未及时更新的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

一、问题

本人在使用layui使用了select按钮,点击是js脚本会异步请求后台接口获取json数据,然后layui将json数据渲染到select上,然而获取接口数据没有问题,就是无法更新。

本人使用代码如下:

发布帖子

js 脚本如下(该代码是修改后的,添加了修改后的关键代码,下面有提示):


二、解决办法:

Layui会对select、checkbox、radio等原始元素隐藏,从而进行美化修饰处理。但这需要依赖于form组件,所以必须加载 form,并且执行一个实例。导航的Hover效果、Tab选项卡等同理(它们需依赖 element 模块)

所以当新添加这些元素时需要对页面表单元素重新渲染一下,需要模仿下面添加关键代码

layui.use('form', function(){
 var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功
 
 //……
 
 //但是,如果你的HTML是动态生成的,自动渲染就会失效
 //因此你需要在相应的地方,执行下述方法来手动渲染,跟这类似的还有 element.init();
 form.render();
});

最后js异步获取的数据可以在select上及时显示了

效果图:

以上这篇解决使用layui对select append元素无效或者未及时更新的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。


推荐阅读
  • 本文档详细规划了从基础到高级的软件测试学习路径,包括但不限于测试基础、Linux和数据库、功能测试、Python编程、接口测试、性能测试、金融项目实战、UI自动化测试等内容,旨在为初学者和进阶者提供全面的学习指导。 ... [详细]
  • 本人最近在学习python,在看了一些教程后,用python写了一个简单的云音乐播放器,下面把主要代码贴上来,其中用到了gi ... [详细]
  • 本文介绍了如何通过安装 VirtualBox 和 Vagrant 来快速搭建和管理虚拟机环境。我们将详细探讨如何选择合适的 Box 镜像,以及如何高效地下载、添加和管理这些镜像。 ... [详细]
  • 解决fetch上传图片至微信公众号H5页面的问题
    在近期的一个项目需求中,需要在微信公众号内嵌入H5页面,并实现用户通过该页面上传图片的功能,包括拍摄新照片或从已有相册中选择。前端开发中采用了fetch API进行接口调用,但遇到了上传图片时数据无法正确传递的问题。 ... [详细]
  • KKCMS代码审计初探
    本文主要介绍了KKCMS的安装过程及其基本功能,重点分析了该系统中存在的验证码重用、SQL注入及XSS等安全问题。适合初学者作为入门指南。 ... [详细]
  • 本文探讨了为何采用RESTful架构及其优势,特别是在现代Web应用开发中的重要性。通过前后端分离和统一接口设计,RESTful API能够提高开发效率,支持多种客户端,并简化维护。 ... [详细]
  • Xcode 快捷键与实用技巧
    在iOS开发过程中,熟练掌握Xcode的快捷键可以显著提升工作效率,减少不必要的鼠标操作,让开发者更加专注于代码编写。本文将介绍一些常用的Xcode快捷键及技巧,帮助开发者提高开发效率。 ... [详细]
  • 手把手教你构建简易JSON解析器
    本文将带你深入了解JSON解析器的构建过程,通过实践掌握JSON解析的基本原理。适合所有对数据解析感兴趣的开发者。 ... [详细]
  • 本文详细介绍了如何手动编写兼容IE的Ajax函数,以及探讨了跨域请求的实现方法和原理,包括JSONP和服务器端设置HTTP头部等技术。 ... [详细]
  • ThinkPHP 文件缓存组件详解与应用
    本文深入探讨了ThinkPHP框架中的文件缓存类实现,提供了详细的代码示例和使用说明,旨在帮助开发者更好地理解和利用这一功能来优化应用程序性能。 ... [详细]
  • 本文基于https://major.io/2014/05/13/coreos-vs-project-atomic-a-review/的内容,对CoreOS和Atomic两个操作系统进行了详细的对比,涵盖部署、管理和安全性等多个方面。 ... [详细]
  • 解决CSS因MIME类型不匹配导致的加载失败问题
    本文详细介绍了在Web开发过程中,遇到CSS文件因MIME类型不匹配而无法正确加载的问题及其解决方案,适合前端开发者阅读。 ... [详细]
  • 我正在从数据库中提取一系列事件,并尝试加载与这些事件相关的所有用户及其个人资料。虽然用户信息能够成功加载,但用户的个人资料信息却未能一同加载。 ... [详细]
  • 本文探讨了在Android平台下编写和读取.JSON文件的方法,解决读取文件时遇到的字符间异常空格问题。 ... [详细]
  • 7000字文章一键排版技巧与实践
    本文探讨了一种高效的文章排版方法,特别适合文字密集型内容,如原创公众号文章。作者通过个人经历,分享了从学习Markdown到利用mdnice实现一键排版的过程,旨在帮助更多内容创作者提升工作效率。 ... [详细]
author-avatar
dtssv90623
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有