Home > Web Front-end > Layui Tutorial > Layui method to modify the value of select

Layui method to modify the value of select

藏色散人
Release: 2020-12-04 09:13:55
Original
5181 people have browsed it

How to modify the select value in layui: First add the code "" in html5 to obtain Initial value; then set the values ​​of select and radio button in js.

Layui method to modify the value of select

The operating environment of this tutorial: Windows 7 system, layui version 2.4. This method is suitable for all brands of computers.

Dynamicly set the select value of layui

Recommended: "javascript basic tutorial" "layUI tutorial"

Add the following code in html5 to obtain the initial value.

<input id="ggg" style="display: none;" value="{$hopedepart}" />
<input id="ddd" style="display: none;" value="{$sex}" />
Copy after login

Then set the values ​​of select and radio button in js.

<script>
    function firstload() {
        var str = "#hopedepart option[value=&#39;" + $("#ggg").val() + "&#39;]";
        var sex = "input:radio[value=&#39;" + $("#ddd").val() + "&#39;]";
     //   document.write(sex);
        $("#hopedepart option[value=&#39;&#39;]").removeAttr("selected"); //2.移除默认选项的选中状态  removeAttr("selected")
        $(str).attr("selected", "selected");
        $(sex).attr(&#39;checked&#39;, &#39;true&#39;);
    }
    firstload();
 
</script>
Copy after login

Give a specific example

html

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <!--引入jQuery-->
 
<input type="hidden" id="position_hidden_id" th:value="${staff?.position}">
 
                    <select name=&#39;position&#39; id="position_id" lay-filter=&#39;aihao&#39;>
                        <option value=&#39;&#39;></option>
<option value=&#39;前端开发&#39;>前端开发</option>
<option value=&#39;后端开发&#39;>后端开发</option>
<option value=&#39;产品&#39;>产品</option>
<option value=&#39;测试&#39;>测试</option>
<option value=&#39;UI&#39;>UI</option>
<option value=&#39;人事&#39;>人事</option>
<option value=&#39;财务&#39;>财务</option>
<option value=&#39;市场&#39;>市场</option>
<option value=&#39;总经理&#39;>总经理</option>
</select>
 
<script>
//alert("ggg");
$(document).ready(function(){ 
        var key1=$("#position_hidden_id").val();
        //根据值让option选中 
        $("#position_id option[value=&#39;"+key1+"&#39;]").attr("selected","selected"); 
       
    });
</script>
Copy after login

The above is the detailed content of Layui method to modify the value of select. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Issues
How about layui framework?
From 1970-01-01 08:00:00
0
0
0
layui cannot be loaded
From 1970-01-01 08:00:00
0
0
0
Why is the reference to layui file invalid?
From 1970-01-01 08:00:00
0
0
0
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template