blocks|key|784673|text|​|type|unstyled|depth|inlineStyleRanges|entityRanges|data|784674|function+getComboA(selectObject)+{
++var+value+=+selectObject.value;++
++console.log(value);
}|code-block|syntax|javascript|784675|<select+id="comboA"+onchange="getComboA(this)">
++<option+value="">Select+combo</option>
++<option+value="Value1">Text1</option>
++<option+value="Value2">Text2</option>
++<option+value="Value3">Text3</option>
</select>|784676|784677|上面的例子得到了OnChange事件上组合框的选定值。|offset|length|784678|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/DOM/element.onchange^0|0|0|0|0|8|8|0|0^^$0|@$1|2|3|4|5|6|7|V|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|W|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|I|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|Z|8|@]|9|@$L|10|M|11|1|12]]|A|$]]|$1|N|3|-4|5|6|7|13|8|@]|9|@]|A|$]]]|O|$P|$5|Q|R|S|A|$T|U]]]]

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function getComboA(selectObject) {
  var value = selectObject.value;  
  console.log(value);
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;select id="comboA" onchange="getComboA(this)"&gt;
  &lt;option value=""&gt;Select combo&lt;/option&gt;
  &lt;option value="Value1"&gt;Text1&lt;/option&gt;
  &lt;option value="Value2"&gt;Text2&lt;/option&gt;
  &lt;option value="Value3"&gt;Text3&lt;/option&gt;
&lt;/select&gt;</code></pre>
</div>
</div>
</p>

<p>The above example gets you the selected value of combo box on <a href="https://developer.mozilla.org/en-US/docs/DOM/element.onchange" rel="noreferrer">OnChange</a> event.</p>


blocks|key|999265|text|另一种在某些情况下可能很方便的方法是将所选<option+/>的值直接传递给函数，如下所示：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|999266|​|999267|function+myFunction(chosen)+{
++console.log(chosen);
}|code-block|syntax|javascript|999268|<select+onChange="myFunction(this.options[this.selectedIndex].value)">
++<option+value="1">Text+1</option>
++<option+value="2">Text+2</option>
</select>|999269|999270|entityMap^0|L|A|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@$9|S|A|T|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|U|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|V|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|J|7|W|8|@]|D|@]|E|$K|L]]|$1|O|3|G|5|6|7|X|8|@]|D|@]|E|$]]|$1|P|3|-4|5|6|7|Y|8|@]|D|@]|E|$]]]|Q|$]]

<p>Another approach wich can be handy in some situations, is passing the value of the selected <code>&lt;option /&gt;</code> directly to the function like this:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function myFunction(chosen) {
  console.log(chosen);
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;select onChange="myFunction(this.options[this.selectedIndex].value)"&gt;
  &lt;option value="1"&gt;Text 1&lt;/option&gt;
  &lt;option value="2"&gt;Text 2&lt;/option&gt;
&lt;/select&gt;</code></pre>
</div>
</div>
</p>


blocks|key|784771|text|关于如何在jQuery中做到这一点：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|784772|<select+id="yourid">
<option+value="Value+1">Text+1</option>
<option+value="Value+2">Text+2</option>
</select>

<script+src="jquery.js"></script>
<script>
$('#yourid').change(function()+{
++alert('The+option+with+value+'+%2B+$(this).val()+%2B+'+and+text+'+%2B+$(this).text()+%2B+'+was+selected.');
});
</script>|code-block|syntax|javascript|784773|你还应该知道Javascript和jQuery是不一样的。jQuery是有效的JavaScript代码，但并非所有JavaScript都是jQuery。您应该查找差异，并确保使用的是适当的差异。|784774|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>For how to do it in jQuery:</p>

<pre><code>&lt;select id="yourid"&gt;
&lt;option value="Value 1"&gt;Text 1&lt;/option&gt;
&lt;option value="Value 2"&gt;Text 2&lt;/option&gt;
&lt;/select&gt;

&lt;script src="jquery.js"&gt;&lt;/script&gt;
&lt;script&gt;
$('#yourid').change(function() {
  alert('The option with value ' + $(this).val() + ' and text ' + $(this).text() + ' was selected.');
});
&lt;/script&gt;
</code></pre>

<p>You should also know that Javascript and jQuery are not identical. jQuery is valid JavaScript code, but not all JavaScript is jQuery. You should look up the differences and make sure you are using the appropriate one.</p>


blocks|key|999379|text|JavaScript解决方案|type|unstyled|depth|inlineStyleRanges|entityRanges|data|999380|<select+id="comboA">
<option+value="">Select+combo</option>
<option+value="Value1">Text1</option>
<option+value="Value2">Text2</option>
<option+value="Value3">Text3</option>
</select>|code-block|syntax|javascript|999381|<script>
+document.getElementById("comboA").onchange+=+function(){
++++var+value+=+document.getElementById("comboA").value;
+};
</script>|999382|或|999383|<script>
+document.getElementById("comboA").onchange+=+function(evt){
++++var+value+=+evt.target.value;
+};
</script>|999384|999385|<script>
+document.getElementById("comboA").onchange+=+handleChange;

+function+handleChange(evt){
++++var+value+=+evt.target.value;
+};
</script>|999386|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|S|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|I|3|J|5|6|7|U|8|@]|9|@]|A|$]]|$1|K|3|L|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|M|3|J|5|6|7|W|8|@]|9|@]|A|$]]|$1|N|3|O|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|P|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|Q|$]]

<h1>JavaScript Solution</h1>

<pre><code>&lt;select id="comboA"&gt;
&lt;option value=""&gt;Select combo&lt;/option&gt;
&lt;option value="Value1"&gt;Text1&lt;/option&gt;
&lt;option value="Value2"&gt;Text2&lt;/option&gt;
&lt;option value="Value3"&gt;Text3&lt;/option&gt;
&lt;/select&gt;
</code></pre>

<pre><code>&lt;script&gt;
 document.getElementById("comboA").onchange = function(){
    var value = document.getElementById("comboA").value;
 };
&lt;/script&gt;
</code></pre>

<p>or</p>

<pre><code>&lt;script&gt;
 document.getElementById("comboA").onchange = function(evt){
    var value = evt.target.value;
 };
&lt;/script&gt;
</code></pre>

<p>or</p>

<pre><code>&lt;script&gt;
 document.getElementById("comboA").onchange = handleChange;

 function handleChange(evt){
    var value = evt.target.value;
 };
&lt;/script&gt;
</code></pre>


blocks|key|784898|text|我发现@Piyush的答案很有帮助，另外，如果你以编程方式创建select，那么有一种重要的方法可以获得这种行为，但这种方法可能并不明显。假设您有一个函数，并创建了一个新的select：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|784899|var+changeitem+=+function+(sel)+{
++console.log(sel.selectedIndex);
}
var+newSelect+=+document.createElement('select');
newSelect.id+=+'newselect';|code-block|syntax|javascript|784900|正常行为可能是这样说的|784901|newSelect.onchange+=+changeitem;|784902|但这实际上并不允许您指定传入的参数，因此您可以这样做：|784903|newSelect.setAttribute('onchange',+'changeitem(this)');|784904|并且您可以设置参数。如果采用第一种方法，那么onchange函数的参数将依赖于浏览器。第二种方法似乎在跨浏览器中工作得很好。|offset|length|style|CODE|784905|entityMap^0|0|0|0|0|0|0|M|8|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Y|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|10|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|O|3|P|5|6|7|12|8|@$Q|13|R|14|S|T]]|9|@]|A|$]]|$1|U|3|-4|5|6|7|15|8|@]|9|@]|A|$]]]|V|$]]

<p>I found @Piyush's answer helpful, and just to add to it, if you programatically create a select, then there is an important way to get this behavior that may not be obvious.  Let's say you have a function and you create a new select:</p>

<pre><code>var changeitem = function (sel) {
  console.log(sel.selectedIndex);
}
var newSelect = document.createElement('select');
newSelect.id = 'newselect';
</code></pre>

<p>The normal behavior may be to say</p>

<pre><code>newSelect.onchange = changeitem;
</code></pre>

<p>But this does not really allow you to specify that argument passed in, so instead you may do this:</p>

<pre><code>newSelect.setAttribute('onchange', 'changeitem(this)');
</code></pre>

<p>And you are able to set the parameter.  If you do it the first way, then the argument you'll get to your <code>onchange</code> function will be browser dependent.  The second way seems to work cross-browser just fine.</p>


blocks|key|999325|text|这对我很有帮助。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|999326|对于select：|999327|$('select_tags').on('change',+function()+{
++++alert(+$(this).find(":selected").val()+);
});|code-block|syntax|javascript|999328|对于单选/复选框：|999329|$('radio_tags').on('change',+function()+{
++++alert(+$(this).find(":checked").val()+);
});|999330|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

<p>This is helped for me.</p>

<p>For select:</p>

<pre><code>$('select_tags').on('change', function() {
    alert( $(this).find(":selected").val() );
});
</code></pre>

<p>For radio/checkbox:</p>

<pre><code>$('radio_tags').on('change', function() {
    alert( $(this).find(":checked").val() );
});
</code></pre>


blocks|key|999305|text|你可以试试下面的代码|type|unstyled|depth|inlineStyleRanges|entityRanges|data|999306|<select+onchange="myfunction($(this).val())"+id="myId">
++++</select>|code-block|syntax|javascript|999307|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>You can try bellow code  </p>

<pre><code>&lt;select onchange="myfunction($(this).val())" id="myId"&gt;
    &lt;/select&gt;
</code></pre>


blocks|key|785349|text|Html模板：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|785350|<select+class="staff-select">
+++<option+value="">All</option>
+++<option+value="196">Ivan</option>
+++<option+value="195">Jon</option>
</select>|code-block|syntax|javascript|785351|Js代码：|785352|const+$staffSelect+=+document.querySelector('.staff-select')

$staffSelect.onchange+=+function+()+{
++console.log(this.value)
}|785353|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>Html template:</p>
<pre><code>&lt;select class=&quot;staff-select&quot;&gt;
   &lt;option value=&quot;&quot;&gt;All&lt;/option&gt;
   &lt;option value=&quot;196&quot;&gt;Ivan&lt;/option&gt;
   &lt;option value=&quot;195&quot;&gt;Jon&lt;/option&gt;
&lt;/select&gt;
</code></pre>
<p>Js code:</p>
<pre><code>const $staffSelect = document.querySelector('.staff-select')

$staffSelect.onchange = function () {
  console.log(this.value)
}
</code></pre>


blocks|key|784975|text|这段代码，一旦我写的只是解释onChange事件的选择，你可以保存这段代码为html，并看到输出它works.and容易理解你。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|784976|<html>
++++<head>
++++++++<title>Register</title>
++++</head>
++++<body>
++++<script>
++++++++function+show(){
++++++++++++var+option+=+document.getElementById("category").value;
++++++++++++if(option+==+"Student")
++++++++++++++++++{
++++++++++++++++++++++++document.getElementById("enroll1").style.display="block";
++++++++++++++++++}
++++++++++++if(option+==+"Parents")
++++++++++++++++++{
++++++++++++++++++++++++document.getElementById("enroll1").style.display="none";
++++++++++++++++++}
++++++++++++if(option+==+"Guardians")
++++++++++++++++++{
++++++++++++++++++++++++document.getElementById("enroll1").style.display="none";
++++++++++++++++++}
++++++++}
++++</script>
++++++++++++<form+action="#"+method="post">
++++++++++++++++<table>
++++++++++++++++++++<tr>
++++++++++++++++++++++++<td><label>Name+</label></td>
++++++++++++++++++++++++<td><input+type="text"+id="name"+size=20+maxlength=20+value=""></td>
++++++++++++++++++++</tr>
++++++++++++++++++++<tr+style="display:block;"+id="enroll1">
++++++++++++++++++++++++<td><label>Enrollment+No.+</label></td>
++++++++++++++++++++++++<td><input+type="number"+id="enroll"+style="display:block;"+size=20+maxlength=12+value=""></td>
++++++++++++++++++++</tr>
++++++++++++++++++++<tr>
++++++++++++++++++++++++<td><label>Email+</label></td>
++++++++++++++++++++++++<td><input+type="email"+id="emailadd"+size=20+maxlength=25+value=""></td>
++++++++++++++++++++</tr>
++++++++++++++++++++<tr>
++++++++++++++++++++++++<td><label>Mobile+No.+</label></td>
++++++++++++++++++++++++<td><input+type="number"+id="mobile"+size=20+maxlength=10+value=""></td>
++++++++++++++++++++</tr>
++++++++++++++++++++<tr>
++++++++++++++++++++++++<td><label>Address</label></td>
++++++++++++++++++++++++<td><textarea+rows="2"+cols="20"></textarea></td>
++++++++++++++++++++</tr>
++++++++++++++++++++<tr+>
++++++++++++++++++++++++<td><label>Category</label></td>
++++++++++++++++++++++++<td><select+id="category"+onchange="show()">++++
++++++++++++++++++++++++++++++++<option+value="Student">Student</option>
++++++++++++++++++++++++++++++++<option+value="Parents">Parents</option>
++++++++++++++++++++++++++++++++<option+value="Guardians">Guardians</option>
++++++++++++++++++++++++++++</select>
++++++++++++++++++++++++</td>
++++++++++++++++++++</tr>
++++++++++++++++</table><br/>
++++++++++++<input+type="submit"+value="Sign+Up">
++++++++</form>
++++</body>
</html>|code-block|syntax|javascript|784977|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>this code once i write for just explain onChange event of select you can save this code as html and see output it works.and easy to understand for you.</p>

<pre><code>&lt;html&gt;
    &lt;head&gt;
        &lt;title&gt;Register&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
    &lt;script&gt;
        function show(){
            var option = document.getElementById("category").value;
            if(option == "Student")
                  {
                        document.getElementById("enroll1").style.display="block";
                  }
            if(option == "Parents")
                  {
                        document.getElementById("enroll1").style.display="none";
                  }
            if(option == "Guardians")
                  {
                        document.getElementById("enroll1").style.display="none";
                  }
        }
    &lt;/script&gt;
            &lt;form action="#" method="post"&gt;
                &lt;table&gt;
                    &lt;tr&gt;
                        &lt;td&gt;&lt;label&gt;Name &lt;/label&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="text" id="name" size=20 maxlength=20 value=""&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr style="display:block;" id="enroll1"&gt;
                        &lt;td&gt;&lt;label&gt;Enrollment No. &lt;/label&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="number" id="enroll" style="display:block;" size=20 maxlength=12 value=""&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;
                        &lt;td&gt;&lt;label&gt;Email &lt;/label&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="email" id="emailadd" size=20 maxlength=25 value=""&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;
                        &lt;td&gt;&lt;label&gt;Mobile No. &lt;/label&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;input type="number" id="mobile" size=20 maxlength=10 value=""&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;
                        &lt;td&gt;&lt;label&gt;Address&lt;/label&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;textarea rows="2" cols="20"&gt;&lt;/textarea&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr &gt;
                        &lt;td&gt;&lt;label&gt;Category&lt;/label&gt;&lt;/td&gt;
                        &lt;td&gt;&lt;select id="category" onchange="show()"&gt;    &lt;!--onchange show methos is call--&gt;
                                &lt;option value="Student"&gt;Student&lt;/option&gt;
                                &lt;option value="Parents"&gt;Parents&lt;/option&gt;
                                &lt;option value="Guardians"&gt;Guardians&lt;/option&gt;
                            &lt;/select&gt;
                        &lt;/td&gt;
                    &lt;/tr&gt;
                &lt;/table&gt;&lt;br/&gt;
            &lt;input type="submit" value="Sign Up"&gt;
        &lt;/form&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>


blocks|key|999447|text|以防有人正在寻找React解决方案，而不需要下载额外的依赖项，你可以这样写：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|999448|<select+onChange={this.changed(this)}>
+++<option+value="Apple">Apple</option>
+++<option+value="Android">Android</option>++++++++++++++++
</select>

changed(){
++return+e+=>+{
++++console.log(e.target.value)
++}
}|code-block|syntax|javascript|999449|确保在构造函数中绑定changed()函数，如下所示：|999450|this.changed+=+this.changed.bind(this);|999451|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>Just in case someone is looking for a React solution without having to download addition dependancies you could write:</p>

<pre><code>&lt;select onChange={this.changed(this)}&gt;
   &lt;option value="Apple"&gt;Apple&lt;/option&gt;
   &lt;option value="Android"&gt;Android&lt;/option&gt;                
&lt;/select&gt;

changed(){
  return e =&gt; {
    console.log(e.target.value)
  }
}
</code></pre>

<p>Make sure to bind the changed() function in the constructor like:</p>

<pre><code>this.changed = this.changed.bind(this);
</code></pre>


blocks|key|999362|text|这在onchange+=+setLocation($(this).val())上对我很有效|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|999363|这里。|999364|++++@Html.DropDownList("Demo",+
new+SelectList(ViewBag.locs,+"Value",+"Text"),+
new+{+Class+=+"ddlStyle",+onchange+=+"setLocation($(this).val())"+});|code-block|syntax|javascript|999365|entityMap^0|D|Q|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|R|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|S|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|T|8|@]|D|@]|E|$]]]|N|$]]

<p>This worked for me onchange = <code>setLocation($(this).val())</code></p>

<p>Here.</p>

<pre><code>    @Html.DropDownList("Demo", 
new SelectList(ViewBag.locs, "Value", "Text"), 
new { Class = "ddlStyle", onchange = "setLocation($(this).val())" });
</code></pre>


blocks|key|785293|text|简单地说：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|785294|​|785295|function+retrieve(){
alert(document.getElementById('SMS_recipient').options[document.getElementById('SMS_recipient').selectedIndex].text);
}|code-block|syntax|javascript|785296|785297|785298|function+retrieve_other()+{
++alert(myForm.SMS_recipient.options[document.getElementById('SMS_recipient').selectedIndex].text);
}

function+retrieve()+{++alert(document.getElementById('SMS_recipient').options[document.getElementById('SMS_recipient').selectedIndex].text);
}|785299|<HTML>
<BODY>
++<p>RETRIEVING+TEXT+IN+OPTION+OF+SELECT+</p>
++<form+name="myForm"+action="">
++++<P>Select:
++++++<select+id="SMS_recipient">
++++++++<options+value='%2B15121234567'>Andrew</option>
++++++++++<options+value='%2B15121234568'>Klaus</option>
++++++</select>
++++</p>
++++<p>
++++++
++++++<input+type="button"+onclick="retrieve()"+value="Try+it"+/>
++++++<input+type="button"+onclick="retrieve_other()"+value="Try+Form"+/>
++++</p>
++</form>
</HTML>
</BODY>|785300|785301|输出:克劳斯或安德鲁，取决于selectedIndex是什么。如果您需要的是值，只需将.text替换为值即可。但是，如果它只是您想要的值(而不是选项中的文本)，则使用document.getElementById('SMS_recipient').value|785302|entityMap^0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|U|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|V|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|W|8|@]|9|@]|A|$]]|$1|J|3|C|5|6|7|X|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|F|7|Z|8|@]|9|@]|A|$G|H]]|$1|O|3|C|5|6|7|10|8|@]|9|@]|A|$]]|$1|P|3|Q|5|6|7|11|8|@]|9|@]|A|$]]|$1|R|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|S|$]]

<p>Simply:</p>
<p><div class="snippet" data-lang="js" data-hide="true" data-console="false" data-babel="false">
<div class="snippet-code snippet-currently-hidden">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function retrieve(){
alert(document.getElementById('SMS_recipient').options[document.getElementById('SMS_recipient').selectedIndex].text);
}</code></pre>
</div>
</div>
</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function retrieve_other() {
  alert(myForm.SMS_recipient.options[document.getElementById('SMS_recipient').selectedIndex].text);
}

function retrieve() {  alert(document.getElementById('SMS_recipient').options[document.getElementById('SMS_recipient').selectedIndex].text);
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;HTML&gt;
&lt;BODY&gt;
  &lt;p&gt;RETRIEVING TEXT IN OPTION OF SELECT &lt;/p&gt;
  &lt;form name="myForm" action=""&gt;
    &lt;P&gt;Select:
      &lt;select id="SMS_recipient"&gt;
        &lt;options value='+15121234567'&gt;Andrew&lt;/option&gt;
          &lt;options value='+15121234568'&gt;Klaus&lt;/option&gt;
      &lt;/select&gt;
    &lt;/p&gt;
    &lt;p&gt;
      &lt;!-- Note: Despite the script engine complaining about it the code works!--&gt;
      &lt;input type="button" onclick="retrieve()" value="Try it" /&gt;
      &lt;input type="button" onclick="retrieve_other()" value="Try Form" /&gt;
    &lt;/p&gt;
  &lt;/form&gt;
&lt;/HTML&gt;
&lt;/BODY&gt;</code></pre>
</div>
</div>
</p>
<p>Output:
Klaus or Andrew depending on what the selectedIndex is. If you are after the value just replace .text with value. However if it is just the value you are after (not the text in the option) then use document.getElementById('SMS_recipient').value</p>


<p>I am a novice at JavaScript and jQuery. I want to show one combobox-A, which is an HTML <code>&lt;select&gt;</code> with its selected <code>id</code> and contents at the other place on onChange(). </p>

<p>How can I pass the complete combobox with its select <code>id</code>, and how can I pass other parameters on fire of the onChange event?</p>


How to pass parameters on onChange of html select

Android

jQuery

我是JavaScript和jQuery的新手。我想展示一个combobox-A，它是一个HTML，其中包含选定的id和onChange()上另一个位置的内容。如何传递带有选择id的完整组合框，以及如何传递onChange事件的其他参数？

问如何在html select的onChange上传递参数
EN

回答 12

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在html select的onChange上传递参数EN

回答 12

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在html select的onChange上传递参数
EN