我有 2 个对话框表单 Add region和 Add country .有<select>每个模态形式的选项。可以有在每个模式形式中重复的选择选项，所以我将它们放在一个类中并通过 display:none 对其进行样式设置。 ，因此 ID 不会重复。
当我需要获取所选项目的 ID 时，它会给我一个未定义的值。我正在使用 $(".region_options").children(":selected").attr("id");获取所选选项的 ID。
这是我的代码。和 jsFiddle
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#dialog-form" ).dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
buttons: {
"Create an account": function() {
var region_id = $(".region_options").children(":selected").attr("id");
alert(region_id)
},
Cancel: function() {
$( this ).dialog( "close" );
}
},
});
$( "#create-user" ).button().click(function() {
$( "#dialog-form" ).dialog( "open" );
});
});
</script>
</head>
<body>
<div id="dialog-form" title="Create new user">
<select class="region_options">
<option>Select Region</option>
<option id="1">Asia / Pacific</option>
<option id="2">North America</option>
<option id="3">sdgvgwqrg</option>
</select>
</div>
<div id="dialog-form1" title="Create new user" style="display:none">
<select class="region_options">
<option>Select Region</option>
<option id="1">Asia / Pacific</option>
<option id="2">North America</option>
<option id="3">sdgvgwqrg</option>
</select>
</div>
<button id="create-user">Create new user</button>
</body>
</html>
最佳答案
<option>元素由 value 标识属性，而不是 id .
<select class="region_options">
<option>Select Region</option>
<option value="1">Asia / Pacific</option>
<option value="2">North America</option>
<option value="3">sdgvgwqrg</option>
</select>
使用 val()方法读取或写入所选选项的值。
var region = $("#dialog-form .region_options").val();
$("#dialog-form1 .region_options").val(region);
关于javascript - 获取选中选项的id，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20698499/