回答:
function getComboA(selectObject) {
var value = selectObject.value;
console.log(value);
}<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>上記の例は、OnChangeイベントでコンボボックスの選択された値を取得します。
getComboA()はvar value = sel.value;
状況によっては便利な別のアプローチとして、次の<option />ように、選択した値を関数に直接渡す方法があります。
function myFunction(chosen) {
console.log(chosen);
}<select onChange="myFunction(this.options[this.selectedIndex].value)">
<option value="1">Text 1</option>
<option value="2">Text 2</option>
</select>jQueryでそれを行う方法について：
<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 ' + $(this).val() + ' and text ' + $(this).text() + ' was selected.');
});
</script>また、JavaScriptとjQueryは同一ではないことも知っておく必要があります。jQueryは有効なJavaScriptコードですが、すべてのJavaScriptがjQueryであるとは限りません。違いを調べ、適切なものを使用していることを確認してください。
htmlData.push($('<select id="choose" name="choose">'));トリックを実行する必要があります（以前に本格的なノードではなく文字列をプッシュしました）。> 6年が経過しました...
<select id="comboA">
<option value="">Select combo</option>
<option value="Value1">Text1</option>
<option value="Value2">Text2</option>
<option value="Value3">Text3</option>
</select><script>
document.getElementById("comboA").onchange = function(){
var value = document.getElementById("comboA").value;
};
</script>または
<script>
document.getElementById("comboA").onchange = function(evt){
var value = evt.target.value;
};
</script>または
<script>
document.getElementById("comboA").onchange = handleChange;
function handleChange(evt){
var value = evt.target.value;
};
</script>私は@Piyushの回答が役に立ち、プログラムに選択を作成する場合、それに追加するだけで、この動作を明確にすることができない重要な方法があります。関数があり、新しい選択を作成するとします。
var changeitem = function (sel) {
console.log(sel.selectedIndex);
}
var newSelect = document.createElement('select');
newSelect.id = 'newselect';通常の動作は言うことかもしれません
newSelect.onchange = changeitem;しかし、これは実際に渡された引数を指定することを許可しないので、代わりにこれを行うことができます：
newSelect.setAttribute('onchange', 'changeitem(this)');そして、あなたはパラメータを設定することができます。最初の方法で行う場合、onchange関数に渡される引数はブラウザーに依存します。2番目の方法は、クロスブラウザーで問題なく動作するようです。
evalような文字列からコードへの変換は必要ありません。実際にnewSelect.onchange = changeitem;changeitemを次のように書き直した場合var changeitem = function () {console.log(this.selectedIndex); };（つまりthis、関数の引数の代わりに使用した場合）は正常に機能します。または、そのままにchangeitemして書き込みnewSelect.onchange = function () {changeitem(this); };ます。
通常、select要素には、アクセスする2つの値があります。
まず、サーバーに送信する値があります。これは簡単です。
$( "#myselect" ).val();
// => 12番目は、選択のテキスト値です。
たとえば、次の選択ボックスを使用します。
<select id="myselect">
<option value="1">Mr</option>
<option value="2">Mrs</option>
<option value="3">Ms</option>
<option value="4">Dr</option>
<option value="5">Prof</option>
</select>「1」だけではなく最初のオプションが選択されている場合に「Mr」という文字列を取得するには、次のようにします。
$( "#myselect option:selected" ).text();
// => "Mr" 以下のコードを試すことができます
<select onchange="myfunction($(this).val())" id="myId">
</select>このコードを書いたら、selectのonChangeイベントを説明するだけで、このコードをhtmlとして保存し、出力を確認できます。わかりやすくなっています。
<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()"> <!--onchange show methos is call-->
<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>誰かがReactソリューションを探している場合に備えて、追加の依存関係をダウンロードする必要がないように書くことができます。
<select onChange={this.changed(this)}>
<option value="Apple">Apple</option>
<option value="Android">Android</option>
</select>
changed(){
return e => {
console.log(e.target.value)
}
}次のように、changed（）関数をコンストラクタにバインドしてください。
this.changed = this.changed.bind(this);これは私のために働いたonchange = setLocation($(this).val())
ここに。
@Html.DropDownList("Demo",
new SelectList(ViewBag.locs, "Value", "Text"),
new { Class = "ddlStyle", onchange = "setLocation($(this).val())" });