我在我的网络应用程序中使用淘汰赛js,我从数据库和绑定数据获取数据使用带有复选框的敲击js工作,当我选中复选框我得到所有相关数据,但我需要元素ID当我选中特定的复选框时,所有的div,是否可能,我是如何实现这个需要的帮助
<div data-bind="foreach:items">
<ul data-role="listview">
<li>
<span id="txtuserID" data-bind="text:userId" style="display:none"></span>
<span id="txtuserName" style="margin-top: 10px;font-size: 22px;font- weight: bold;padding-left:0px;" data-bind="text:username"></span>
<div data-bind="attr:{id:$index()}, Image({image});" class="Image">
<div id="img1"><img src=1.png /><div>
<div id="img2"><img src=2.png /><div>
<div id="img3"><img src=3.png /><div>
</div>
<input id="chkID" type="checkbox" data-bind="value:userId(), checked: $root.addItemTitle, click: $root.toggle" /></li>
<ul>
</div>
<!-- language: lang-js -->
function UserDetails() {
var self = this;
function(userId username) {
var self = this;
self.userId = userId;
self.username = ko.observable(username)
self.Image=ko.computed(function() {
return this.Image() + " " + this.Imagetype();
}, this);
}
}
self.addItemTitle = ko.observable();
//Check Box Selected
self.toggleAssociation = function(item, event) {
if (item.Selected() === true) console.log("dissociate item " + item.userId());
else console.log("associate item " + item.UserID() + " " + "UserName " + item.UserName(), "you clicked " + event.target.id);
/// here i am getting userID,Username and checkbox element id=chkid, is it possible to get userName elementID
item.Selected(!(item.Selected()));
return true;
};
}
答案 0 :(得分:0)
要浏览HTML域,您可以使用这两个JS方法
event.target.parentElement //Returns the parent object
event.target.children //Returns Children
所以你可以这样做:
var li = event.target.parentElement;
表示您可以访问与复选框相关的所有对象。为了得到div孩子,你可以这样做:
var liChild = li.children;
返回div中所有元素的数组。
获取所有ID,你可以这样做:
function getIDs(array) {
var output = [];
for (var i = 0; i < array.length; i++) {
output[i] = array[i].id;
}
return output;
}
然后
var ids = getIDs(liChild);
如果你想获得div,你可以做到这一点
var li = event.target.parentElement;
var ul = li.parentElement;
var div = ul.parentElement;
var divChild = div.children;
var divIDs = getIDs(divChild);
编辑:以下是您编辑的新代码
好的,通过编辑你引入了一个包含其他div的div,我的awnser仍然适用,但有一些增强功能。您仍然可以使用.children和.parentElement来查找这些元素。
var li = event.target.parentElement; //Finds parent element
var imageDiv = li.getElementsByClassName('Image')[0]; //Finds the "Image" Div (the zero is there because .getElementByClass returns an array)
var imageChild = imageDiv.children; //Gets the children
var ids = getIDs(imageChild); //Gets the IDs of the children