Home > Article > Web Front-end > An example explains how jQuery implements the method of adding the value in the click drop-down box to the text box.
This article mainly introduces jQuery's method of adding the value in the click drop-down box to the text box, involving jQuery event binding and dynamic acquisition and operation of page element attributes. Friends who need it can refer to it. I hope it can help. to everyone.
Let’s take a look at the running effect first:
The specific code is as follows:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <title>www.jb51.net jQuery添加下拉框元素</title> <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script> </head> <!-- 加在body标签中屏蔽右键 oncontextmenu="return false" --> <body > <select name="city" id="s2" lay-search> <option value="">请选择</option> <option value="layer">layer</option> <option value="form">form</option> <option value="layim">layim</option> </select> <button class="layui-btn " type="button" id="add_subject">添加</button> <input name="subject" id="subject" type="text" data-label="," value=""> <script> var seleVal=''; $("#add_subject").on("click",function(){ seleVal+=$("#s2>option:selected").val()+','; $("#subject").val(seleVal); }) </script> </body> </html>
Related recommendations:
Three ways of using js and jQuery to implement the user registration countdown function
jQuery implements preview function before uploading image files
The above is the detailed content of An example explains how jQuery implements the method of adding the value in the click drop-down box to the text box.. For more information, please follow other related articles on the PHP Chinese website!