这里的场景是,我已经创建了工具提示,并且对于我已经给出不同id的所有div
标签,基于它们的id它应该生成不同的工具提示..因为我正在使用{{1}在javascript下的条件和检查if else
的id,但是这里的代码不会在其他情况下进入条件:你可以查看this link上的实例。伙伴们请帮我解决,谢谢你提前.. :)
答案 0 :(得分:0)
document.getElementById("ips")
总是返回Html div对象,其布尔值为true。 comapare的价值。
你需要抓住属性" id"来自事件的目标并将其与您的div id进行比较。
if(event.target.id=="ips")
{
$('<div class="tooltip">situated on or affecting the same side</div>')
.appendTo('body');
}
else if(event.target.id=="tyu")
{
$('<div class="tooltip">hi i m tooltip</div>').appendTo('body');
}else....
答案 1 :(得分:0)
你做错了:
if(document.getElementById("ips"))
这总是如此,因为总有一个id为ips
的元素。你想要的是将它与实际的id进行比较:
var this_id = $(this).attr("id");
if(id === "ips")
答案 2 :(得分:0)
使用
if (event.target.id == "ips") {/*Code*/}
else if (event.target.id == "tyu") {/*Code*/}
else {/*Code*/}
而不是document.getElementById
答案 3 :(得分:0)
试试这个:http://jsfiddle.net/6CBMw/8/
var linkId = $(this).attr('id');
switch(linkId){
case 'ips':
$('<div class="tooltip">situated on or affecting the same side</div>').appendTo('body');
break;
case 'tyu':
$('<div class="tooltip">hi i m tooltip</div>').appendTo('body');
break;
default:
$('<div class="tooltip">hi i m LAST LAST tooltip</div>').appendTo('body');
break;
}
答案 4 :(得分:0)
<强> http://jsfiddle.net/6CBMw/13/ 强>
$(document).ready(function() {
var changeTooltipPosition = function(event) {
var tooltipX = event.pageX - 8;
var tooltipY = event.pageY + 8;
$('div.tooltip').css({top: tooltipY, left: tooltipX});
};
var showTooltip = function(event) {
console.log(event.target);
$('div.tooltip').remove();
if(event.target == document.getElementById('ips'))
{
$('<div class="tooltip">situated on or affecting the same side</div>').appendTo('body');
} else if(event.target == document.getElementById('tyu')){
$('<div class="tooltip">hi i m tooltip</div>').appendTo('body');
} else {
$('<div class="tooltip">hi i m LAST LAST tooltip</div>').appendTo('body');
}
changeTooltipPosition(event);
};
var hideTooltip = function() {
$('div.tooltip').remove();
};
$('div#ips, div#tyu').bind({
mousemove : changeTooltipPosition,
mouseenter : showTooltip,
mouseleave: hideTooltip
});
});