An example explains how jQuery implements the method of adding the value in the click drop-down box to the text box.-JS Tutorial-php.cn

An example explains how jQuery implements the method of adding the value in the click drop-down box to the text box.

小云云

Release： 2017-12-26 15:13:38

Original

1358 people have browsed it

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=&#39;&#39;;
  $("#add_subject").on("click",function(){
    seleVal+=$("#s2>option:selected").val()+&#39;,&#39;;
    $("#subject").val(seleVal);
  })
</script>
</body>
</html>

Copy after login

Related recommendations:

Detailed example of how jQuery implements the function of switching between hiding and displaying and switching icons at the same time

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!