如何检查是否选择了object？
如何检查是否选择了object？
提问于 2015-12-17 06:15:41
我有一个在jQuery中定义的对象，我有一个列表，我需要做一个函数来检查列表中的一个对象是否被选中。我正在尝试使用此代码，但它不起作用。有人能帮我吗？.selectable就是列表。
if ( $('.selectable').is(':selected') ) {
$('#edit').click(function () {
$('#high-level').hide();
$('#low-level').show();
})
}回答 2
Stack Overflow用户
发布于 2015-12-17 06:52:05
循环遍历数组，测试是否选择了每个元素。下面的代码假设list是一个元素ID数组。
var is_selected = false;
for (var i = 0; i < list.length; i++) {
if ($("#" + list[i]).is(":selected")) {
is_selected = true;
break;
}
}Stack Overflow用户
发布于 2015-12-17 07:01:40
将此行更改为：
$('.selectable').append("<li><span class='name'>" + data[i].name + " </span><span class='grade'>" + prosek + "</span></li>");注释此行(这不是一个函数)，并将给出一个错误：
//$('.selectable').selectable();如下所示更改函数：
$('.selectable li').on('click', function(){
console.log($(this).find('.name').html());
var name = $(this).find('.name').html();
var grade = $(this).find('.grade').html();
$("#name").val(name)
$("#index").val(grade)
$('#high-level').hide();
$('#low-level').show();
})现在只需单击学生姓名，将学生数据加载到输入中。实际上，你不需要一个额外的按钮来做这件事。
注意：我建议您这样做，因为您的目标是检索学生姓名。
您的新评论的其他信息：
列表如下：
这就是我点击其中一个的原因：
下面是完整的HTML页面，也许你把javascript放错了地方：
<!--DOCTYPE html -->
<html><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<META HTTP-EQUIV="Expires" CONTENT="-1">
<meta name="description" content="">
<meta name="keywords" content="">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"/>
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<style type="text/css">
label {
display: inline-block;
width: 100px;
margin: 5px;
}
input {
width: 90px;
margin: 5px;
}
li:hover {
cursor: pointer;
}
#feedback {
font-size: 1.4em;
}
.selectable .ui-selecting {
background: #FECA40;
}
.selectable .ui-selected {
background: #F39814;
color: white;
}
.selectable {
list-style-type: none;
margin: 0;
padding: 0;
width: 40%;
display: inline-block;
}
.selectable li {
margin: 3px;
padding: 0.4em;
font-size: 1.4em;
height: 50px;
}
.content {
width: 300px;
background: #eef;
padding: 5px;
border: 1px grey dotted;
font-size: 1.4em;
}
ul {
list-style: none;
}
</style>
</head>
<body>
<div id="high-level">
<button id="edit">Edit students</button>
<br/><br/>
<ol class="selectable"></ol>
</div>
<div id="low-level">
<div>
<input id="prev" value="prev" type="button"/>
<input id="top" value="top" type="button"/>
<input id="next" value="next" type="button"/>
</div>
<label>Name</label>
<input id="name" class="content"></input><br/>
<label>Index</label>
<input id="index" class="content"></input>
<div id="grades" style="overflow: hidden;"></div>
<button id="save">Save</button>
</div>
<script type="text/javascript">
var data = [
{
index: 123123,
name: "Nikola Nikolovski",
grades: [
{
course: "Calculus",
grade: 10
},
{
course: "OOP",
grade: 9
},
{
course: "Interactive Applications",
grade: 10
},
],
edit: false
},
{
index: 123124,
name: "Petko Petkovski",
grades: [
{
course: "User Interfaces",
grade: 8
},
{
course: "OOP",
grade: 9
},
{
course: "Interactive applications",
grade: 8
},
],
edit: false
},
{
index: 123125,
name: "Petar Petrevski",
grades: [
{
course: "Calculus",
grade: 6
},
{
course: "OOP",
grade: 9
},
{
course: "User Interfaces",
grade: 10
},
],
edit: false
}
];
$(document).ready(function () {
$('#high-level').show();
$('#low-level').hide();
for (var i = 0; i < data.length; i++) {
var sum = 0;
var prosek = 0;
for (var j = 0; j < data[i].grades.length; j++) {
sum += data[i].grades[j].grade;
}
prosek = sum / data[i].grades.length;
prosek = prosek.toFixed(2);
$('.selectable').append("<li><span class='name'>" + data[i].name + " </span><span class='grade'>" + prosek + "</span></li>");
}
var $selected = $('.selectable .ui-selected').val();
console.log($selected)
$('.selectable li').on('click', function(){
console.log($(this).find('.name').html());
var name = $(this).find('.name').html();
var grade = $(this).find('.grade').html();
$("#name").val(name)
$("#index").val(grade)
$('#high-level').hide();
$('#low-level').show();
})
$('#top').click(function () {
$('#high-level').show();
$('#low-level').hide();
});
})
</script>
</body></html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/34323140
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号