layui 动态加载select并option选中但没有赋值

眼泪落在琴弦

于 2021-02-25 16:47:50 发布

阅读量712

点赞数

分类专栏：前端

本文链接：https://blog.youkuaiyun.com/qq_42923536/article/details/114091584

版权

前端专栏收录该内容

16 篇文章

订阅专栏

博客聚焦于layui框架，提到在动态加载select时，虽option被选中但却未赋值的情况。这属于前端开发中可能遇到的问题，涉及到layui框架对表单元素的处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

layui 动态加载select并option选中但没有赋值

 var select='dd[lay-value='+data.code+']';
  $("#code").siblings("div .layui-form-select").find('dl').find(select).click();

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

眼泪落在琴弦

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

[Layui]Open子页面动态下拉框赋值解决办法

德仔

03-07

1211

子页面动态下拉框赋值上篇文章解决了如何联动问题，但是还有一种情况，open子页面时给动态下拉框赋值。直接赋值并不可以，此时下拉框是没有数据的。监听函数并不会触发动态函数。我的思路：给第一个下拉框直接赋值(本次测试用静态)，执行子页面函数加载回调，待回调函数加载完毕数据，然后动态下拉框赋值。 HTML: if (obj.event === 'edit') { var index = layer.open({ title: '编辑视

layui中的select下拉框，数据加载出来了，下拉框里面却没有数据，是什么原因？（已解决）

weixin_45932157的博客

02-10

6738

这个问题坑了我很久了。错误显示：我们可以看到竟然没有把数据添加进去。当我们检查的时候数据是有的但dl里的数据就没有了，说明是没有渲染出来。解决方法：看代码： html代码： <div class="layui-input-inline" > <select name="quiz2" id="quiz2" lay-filter=...

参与评论您还未登录，请先登录后发表或查看评论

layui select数据动态添加（下拉框数据填充赋值）附所有代码

04-28

5737

引用文件如下： <script type="text/javascript" src="js/jquery-3.0.0.min.js"></script> <link rel="stylesheet" href="css/layui.css"> <script type="text/javascript" src="layui.js"></sc...

foreach回显layui的select时，value无法赋值

兔老大的胡萝卜

11-19

1594

这个问题比较恶心人原因1 ： layui 不是双向绑定的页面加载完成后需要执行form.render(‘select’) 或者layui.form(‘select’).render(); 两者区别： layui.form('select').render(); 这个是可以只刷新你动态更新的那部分select 官方推荐的 form.render(‘select’); 这个是会出现我提到的问题 ...

为 layui 的下拉框为其赋值，只选中option，而不改变框内的内容

daxiong0816的博客

11-01

585

因为没有对表单渲染，加上这一句： form.render(‘select’);

异步ajax实例

weixin_45768244的博客

10-12

212

templates下的Ajaxlineflask.html <!DOCTYPE html> <head> <meta charset="utf-8"> <title>Ajaxline</title> <style type="text/css"> *{ margin:0px; } #main{ height:400px; } </sty

laui select 下拉框值不改变

一江水_1210的博客

09-28

554

<div class="layui-inline layui-form"> <label class="layui-form-label">商品类型：</label> <div class="layui...

解决layui动态添加select option 不显示的问题

BlueSky

05-14

7341

$.ajax({ url:'{:U('xxx/xxx')}', type:"post", data:{id:data.id}, dataType:"json", success:function(rs){ $("#fine...

使用layui监听器监听select下拉框,事件绑定不成功的解决方法

10-16

1. **渲染问题**：如果你是在运行时动态添加的option选项，需要确保调用`form.render('select')`来重新渲染select元素，使layui能够正确绑定事件。例如： ```javascript // 动态添加option var option = '...

layui中清空指定select_layui select 选完其他选项，手工清空选项又恢复最初的选项？...

weixin_39847437的博客

12-20

4608

启用layui的select 下拉搜索项： lay-search企业：业务场景：选择某企业之后，无法清空选项。清空时点击空白处，应该默认为“请选择”$(document).on("input propertychange", "select[lay-search] ~ div input", function () {if ($(this).val() == "") {//alert($(thi...

layui select选中不填充问题解决

weixin_42782214的博客

12-10

1565

今天遇到一个问题，我明明已经赋值于select，但是下拉确实是已经选中了，但是select框中没有回显最初我是这样赋值的：在网上找了找资料发现应该这样赋值：这样就完美解决了。还有一种方法是通过ajax给select动态赋值记得给select动态赋值之后，需要form.render()方法将select刷新一下，才可行，不然select读取值得时候会不稳定。 ...

layui页面的下拉框的值没有带入

qq_39162838的博客

03-22

1193

新增了一天数据，是通过下拉框赋值，但是点击编辑，修改内容的时候，并没有把值赋给下拉框，修改办法如下，让下拉框再次渲染就好加了这行代码后，下拉框中就有值了。 ...

layui的form表单中select选择框内容不显示

CharlesMo1996的博客

03-29

3737

页面问题如图性别和户主关系的下拉选择框没有显示 html文件代码如下检查html代码没有发现问题 js文件代码如下问题原因及解决办法 layui下如 html代码是动态生成的，自动渲染会失效，此时需要手动渲染表单在 js文件中的适当位置添加 form.render(); 即可解决问题；解决js代码如下 ‘use strict’ layui.use([‘layer’,‘form’,‘ta...

layui 中 select 绑定动态数据不显示的问题

weixin_44165899的博客

07-14

1412

layui是大家比较喜欢的后台搭建框架，但它在给大家带来便利的同时，有会出现一些问题，比如select绑定动态数据不显示。我在项目中就遇到了这个问题，解决方法如下 layui.use(['form' ], () => { let _this = this //绑定this let form = layui.form let

layui选择框赋值不显示_layui下拉框后台动态赋值

weixin_32944341的博客

02-17

161

前台页面：前台js:layui.use([‘form‘, ‘upload‘, ‘layer‘], function () {var form = layui.form;//检查项目添加到下拉框中$.ajax({url: ‘../hwjg_App/hwjgApp_ashx/GetXm.ashx‘,dataType: ‘json‘,type: ‘get‘,success: function (data...

layui渲染下拉框，动态设置下拉框的内容，获取下拉框自定义属性

飞一样的编程

08-08

1574

layui渲染下拉框，设置下拉框，设置验证 <div class="layui-form-item"> <label for="department_id" class="layui-form-label"> <span class="x-red">*</span>部门 </label>

layui select下拉框动态加载失败无数据

可控的事情要谨慎，不可控的事情要乐观。

11-28

1237

layui的select 若已经给了选项的数据，它还会动态生成另外一段代码： <dl class="layui-anim layui-anim-upbit"/> 想自己添加动态的数据，则我们也需要添加： <dl class="layui-anim layui-anim-upbit"/> 的选项数据，否则，select会失效。 $("#GoodsModifyModel_G...

LayUI之select动态赋值的显示问题

千羽公子的专栏

09-18

4741

玩这个东西就像剥玉米，剥了一层，还有一层，刚解决这个问题，下一个问题就来了。问题：昨天是解决了select的监听事件，以为问题就解决了，开始动态赋值，结果问题就来了，用异步加载数据，赋值，按照常理是没有问题，可是在layui中是有问题的，数据加载时正常的，只是显示不出来，可能是layui的自身原因吧，那么解决问题，也是要按照layui的标准来。首先，是要加载模块layui.use(这个东西...

layui动态渲染select等组件并初始化赋值失败

weixin_30352645的博客

07-25

1154

描诉：有一个用户信息form表单，其中有部门单选框，数据库中有一张dept（部门）表，要动态渲染出所有部门，并默认选中用户所在部门关键代码： html页面 <div class="layui-form-item"> <label class="layui-form-label">所属部门</label>...

把HTML里面的type的数值写成固定数值3，以下是原代码{include file='common/head' /} <link rel="stylesheet" href="__LIB__/select2/select2.min.css" /> <link rel="stylesheet" type="text/css" href="__SFDP__/lib/selecttree/select2totree.css?v=5.0.0"> <div class="layui-fluid"> <div class="layui-card">         <label class="layui-form-label sl-request">是否出库：</label> <div class="layui-input-block"> <select id="type" class="layui-input"> <option value="0">否</option> <option value="1" selected>是</option> <

最新发布

04-22

<think>好的，我现在需要帮助用户将HTML中的select标签的某个option设置为默认选中，具体是值为3的选项。首先，我得回忆一下HTML中select和option的基本用法。记得每个option有一个selected属性，用来指定默认选中的项。所以用户应该是在某个select里有多个option，其中某个的value是3，需要让它默认选中。接下来，检查用户提供的引用内容。引用[2]提到，默认情况下select会以第一个option为默认选项，这符合我的记忆。用户的问题是如何改变这个默认行为，让value为3的选项被选中。根据引用中的例子，应该是在对应的option标签中添加selected属性，不需要值，只要存在即可。例如，如果原本的option是`<option value="3">选项</option>`，需要改成`<option value="3" selected>选项</option>`。然后，考虑用户可能的代码结构。假设用户有一个类似的结构： ```html <select id="taste"> <option value="1">选项1</option> <option value="2">选项2</option> <option value="3">选项3</option> </select> ``` 要让第三个选项默认选中，用户只需在第三个option标签里添加selected属性。需要提醒用户确保只有一个option有selected属性，否则浏览器可能只认第一个出现的。另外，用户提到的引用[1]中关于CSS样式的部分可能无关，但用户可能之前尝试过其他方法，比如隐藏默认样式，但问题核心还是HTML的属性设置。所以重点应放在正确的HTML修改上，而不是CSS技巧。还需要确认用户是否希望这个默认值在页面加载时就生效，而不是通过JavaScript动态设置。如果是静态页面，直接修改HTML即可；如果是动态生成的内容，可能需要检查后端模板或前端脚本是否覆盖了默认值。最后，确保回答清晰，分步骤说明，并给出示例代码，这样用户可以直接复制修改。同时，预想用户可能遇到的问题，比如多个selected属性或拼写错误，提醒用户检查这些点。</think>要将HTML中$<select>$标签的某个$<option>$设置为默认选中状态，需在对应$<option>$标签中添加`selected`属性。若要固定默认值为数值3，具体实现步骤如下： ### 实现步骤 1. **定位目标选项**：在$<select>$标签内找到`value="3"`的选项 2. **添加属性**：为该选项添加`selected`属性（无需赋值） 3. **验证唯一性**：确保只有一个选项包含`selected`属性示例代码： ```html <select id="mySelect"> <option value="1">选项1</option> <option value="2">选项2</option> <option value="3" selected>选项3</option>  <option value="4">选项4</option> </select> ``` ### 注意事项 - 浏览器会优先显示**最后一个**带有`selected`属性的选项[^2] - 若需要动态设置默认值，可通过JavaScript实现： ```javascript document.getElementById('mySelect').value = '3'; ``` - 对于CSS样式兼容性问题，可使用引用[1]提到的`div`容器包裹方案