I'm trying to check an element for an empty attribute, but can't seem to get things to work.
Here's my html code:
<div class="item">
<div class="itemBtn" style="visibility:hidden;">
</div>
<div class="itemText" itemtype="loader">
</div>
</div>
<div class="item">
<div class="itemBtn">
</div>
<div class="itemText" itemtype="">
</div>
</div>
Here's a jquery hover function that essentially just turns on the button. I was trying to build upon it by saying 'if theres no itemtype, dont turn it on'
inner.find(".item").hover(function () {
if (inner.find(".item-text[itemtype='']")) {
$(this).children(".itemBtn").css("visibility", "hidden");
} else {
$(this).children(".itemBtn").css("visibility", "visible");
}
}, function () {
$(this).children(".itemBtn").css("visibility", "hidden");
});
UPDATE: I ended up solving this by doing the following:
inner.find(".item").hover(function () {
if ($(this).find("div[itemtype='']").length) {
$(this).children(".itemBtn").css("visibility", "hidden");
} else {
$(this).children(".itemBtn").css("visibility", "visible");
}
}, function () {
$(this).children(".itemBtn").css("visibility", "hidden");
});
I'm trying to check an element for an empty attribute, but can't seem to get things to work.
Here's my html code:
<div class="item">
<div class="itemBtn" style="visibility:hidden;">
</div>
<div class="itemText" itemtype="loader">
</div>
</div>
<div class="item">
<div class="itemBtn">
</div>
<div class="itemText" itemtype="">
</div>
</div>
Here's a jquery hover function that essentially just turns on the button. I was trying to build upon it by saying 'if theres no itemtype, dont turn it on'
inner.find(".item").hover(function () {
if (inner.find(".item-text[itemtype='']")) {
$(this).children(".itemBtn").css("visibility", "hidden");
} else {
$(this).children(".itemBtn").css("visibility", "visible");
}
}, function () {
$(this).children(".itemBtn").css("visibility", "hidden");
});
UPDATE: I ended up solving this by doing the following:
inner.find(".item").hover(function () {
if ($(this).find("div[itemtype='']").length) {
$(this).children(".itemBtn").css("visibility", "hidden");
} else {
$(this).children(".itemBtn").css("visibility", "visible");
}
}, function () {
$(this).children(".itemBtn").css("visibility", "hidden");
});
Share
Improve this question
edited Jun 25, 2014 at 12:44
jessikwa
asked Jun 24, 2014 at 21:19
jessikwajessikwa
7501 gold badge8 silver badges24 bronze badges
2
- And? What happens when you run the code? – Bluefire Commented Jun 24, 2014 at 21:20
- You should use .attr() and conditionally check it. – Christopher Marshall Commented Jun 24, 2014 at 21:21
4 Answers
Reset to default 4it's just simple example
var attr = $(this).attr('title');
if (typeof attr !== typeof undefined && attr !== false) {
//do some thing
}
Use .attr
like this with a conditional:
var attr = $(this).attr('title');
if (!attr) {
// Do something
}
Or you can make it more concise by checking the attribute in the conditional like this:
if (!$(this).attr('title')) {
// Do something
}
if (! $('.item-text').attr('itemtype') ) {
alert("Nothing in itemtype");
} else {
alert("Not empty");
}
Very simple, just check to see if the attribute exists or not using attr(), like so:
if (!$(this).attr('title')) {
alert('Exists!');
}