获取更改时选择输入的值
[英]getting the value of Select input on change
问题描述
I am trying to get the value of the selected option in a Select input but it isn't working. 
我正在尝试在“选择”输入中获取所选选项的值，但是它不起作用。 It should be displaying an alert box when I change the option, but nothing is happening. 当我更改选项时，它应该显示一个警告框，但是什么也没有发生。 Here is my code. 这是我的代码。
<html>
<head>
<?PHP
$content ="";
$mammalArray = array();
$otherArray = array();
array_push($mammalArray,"dog");
array_push($mammalArray,"cat");
array_push($mammalArray,"pig");
array_push($otherArray,"bird");
array_push($otherArray,"fish");
$content .= "<select><option value='0'>Please Select a Pet Item</option>";
$content .= "<optgroup label='Mammals'>";
foreach($mammalArray as $animal=>$pet)
{
$content .= "<option>" . $pet . "</option>";
}
$content .= "</optgroup><optgroup label='Other'>";
foreach($otherArray as $animal=>$pet)
{
$content .= "<option>" . $pet . "</option>";
}
$content .= "</optgroup></select>";
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script type="text/javascript">
$("select").change(function(){
// Do something here.
//alert("hello");
var option = $(this).find('option:selected').val();
alert(option);
});
</script>
</head>
<body>
<?php
echo($content);
?>
</body>
</html>
4 个解决方案
解决方案1
3 2016-02-04 15:10:31
You have no value in your options and you need to wrap following around your script: 您的选择没有价值，您需要在脚本中包装以下内容：
$(function() {
$("select").change(function(){
var option = $(this).find('option:selected').val();
alert(option);
});
)};
解决方案2
0 2016-02-04 15:12:43
Your javascript is being executed before your HTML is set in the DOM. 在DOM中设置HTML之前，将执行JavaScript。 Either wrap your code in a $(document).on('ready') handler or place it just before your </body> , after your HTML: 将代码包装在$(document).on('ready')处理程序中，或者将其放在</body> ，HTML后面：
$(document).on('ready', function(){
$("select").change(function(){
var option = $(this).find('option:selected').val();
alert(option);
});
});
解决方案3
0 2016-02-04 15:13:12
<script type="text/javascript">
$(document).on("change", "select", function () {
// Do something here.
//alert("hello");
var option = $(this).val();
alert(option);
});
</script>
解决方案4
0 已采纳 2016-02-04 15:14:42
Your options have no values so you need to update your foreach loops to include one. 您的选项没有值，因此您需要更新foreach循环以使其包含一个。 For example:- 例如：-
foreach($mammalArray as $animal=>$pet)
{
$content .= '<option value="' . $pet . '">' . $pet . '</option>';
}
Then update your jQuery so that it is wrapped in $(function() {}); 然后更新您的jQuery，使其包装在$(function() {}); to make sure the document is ready before running:- 确保在运行之前准备好文档：-
$(function() {
$("select").change(function(){
var option = $(this).find('option:selected').val();
alert(option);
});
)};
Without setting the value attribute of your <option> tags there will be no value for $(this).find('option:selected').val(); 如果不设置<option>标记的value属性，则$(this).find('option:selected').val();将没有值$(this).find('option:selected').val(); . 。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.