Home >Web Front-end >JS Tutorial >js method to add the value and text of the default option under select_javascript skills

js method to add the value and text of the default option under select_javascript skills

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOriginal
2016-05-16 16:33:271753browse

<p>Drop-down box tag in jsp: </p>
<p><select name="sjx" id="sjx" list="sjxList" listkey="BM" listvalue="MC" size="20" cssstyle="width:100%;height:70px; border:0" multiple></select></p>
<p></p><div class="codetitle">
<span><a style="CURSOR: pointer" data="14907" class="copybut" id="copybut14907" onclick="doCopy('code14907')"><u>Copy code</u></a></span> The code is as follows:</div><div class="codebody" id="code14907">
<br>
<pre name="code" class="html"> <br>
<br>
multiple="true" means supporting multiple selections. <br>
<br>
<br>

A flexible way to create items under the select tag in js:

Copy code The code is as follows:

var oSelect = $("sjx"); //sjx is html or The id of the select tag on the jsp page. If you use Extjs, you can use EXT.getDom('sjx') to get the tag <br>
<br>
var oOption = document.createElement("OPTION"); //Create the OPTION sub-tag under the select tag in js 
oSelect.options.add(oOption); //Add the new OPTION sub-tag to the select tag
oOption.value = "001"; //The value corresponding to the content
oOption.innerHTML ="Little Apple"; //Contents of the displayed drop-down box
...and so on

Note: This method in js is more useful in specific situations. For example, the request here does not return a specific interface, that is, the entire interface is not refreshed. Instead, Ajax asynchronous requests are used to make some local data requests. At this time, the strut2 method below will be invalid.

Copy code The code is as follows:

<pre name="code" class="java">for(...){ <br>
HashMap<string> map = new HashMap<string>(); <br>
map.put("BM","001"); <br>
map.put("MC","Little Apple"); <br>
sjxList.add(map); <br>
} <br>
</string></string>

Another way is also very common: use the features of struts2 to define a List variable in Action (take this example as an example, named: sjxList), and set the set and get methods.

Add content through a HashMap object, such as:

When returning to the interface, "Little Apple" will be displayed in the select drop-down box of the interface.
<pre name="code" class="html">最简单的一种方式: 
直接在jsp页面手动添加select标签的OPTION项 
<html> 
<body> 
<form> 
<select id="cars" name="cars"> 
<option value="volvo">Volvo</option> 
<option value="binli">Binli</option> 
<option value="mazda" selected="selected">Mazda</option> 
<option value="audi">Audi</option> 
</select> 
</form> 
</body> 
</html> 
Statement:
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
Previous article:js implementation of flying into the stars special effects code_javascript skillsNext article:js implementation of flying into the stars special effects code_javascript skills

Related articles

See more