在高亮显示DIV然后隐藏

我试图在突出显示特定文本时显示隐藏的DIV标记。我能得到一个隐藏的div显示凸显，但2个部分，我不能做到是：突出显示特定的文字时（我假设使用span标签ID或类似的东西）在高亮显示DIV然后隐藏

只显示
将显示更改为阻止后，5秒后将其更改为隐藏。

这是我的尝试。再一次，这确实显示了突出显示的隐藏分区，但这是我得到的。请帮忙！

function ShowNote() { 
 
    document.getElementById('Note').style.display = 'block'; 
 
} 
 

 
document.onmouseup = ShowNote; 
 
if (!document.all) document.captureEvents(Event.MOUSEUP); 
 

 
function HideNote() { 
 
    document.getElementById('Note').style.display = 'hidden'; 
 
} 
 
setTimeout("HideNote()", 5000); // after 5 secs

I DON'T want it to show when I highlight this text 
 
<br />I DO want it to show when I highlight this text. 
 
<div type='text' id='Note' style="display:none;">HIDDEN DIV CONTENT</div>

来源

2017-02-01 Michael Jolly

你在浏览器中得到什么错误？抛出一个快速的jsfiddle，但我现在可以说，用这个代码你会得到'未捕获的引用错误：未定义隐藏注册'的错误。 –

[看这里]（http://stackoverflow.com/a/3545105/1891677），可能还有它上面的那个。 –

'style.display ='hidden''无效。你想要'style.display ='none';' –

您正在使用相当陈旧且过时的代码。下面是现代的方法：

function showNote() { 
 
    document.getElementById('Note').classList.remove("hide"); 
 
    setTimeout(hideNote, 5000); // after 5 secs 
 
} 
 

 
function hideNote(){ 
 
    document.getElementById("Note").classList.add("hide"); 
 
} 
 

 
document.getElementById("select").addEventListener("mouseup", showNote);

.hide { display: none; } 
 

 
#select { color:red; }

<div>I DON'T want it to show when I highlight this text</div> 
 
<div>I DO want it to show when I highlight <span id="select">this text</span>.</div> 
 
<div type='text' id='Note' class="hide">HIDDEN DIV CONTENT</div>

来源

2017-02-01 23:17:46

你非常接近！

这是我有：

function ShowNote() { 
 
    if(window.getSelection() == "I DO want it to show when I highlight this text.") 
 
     document.getElementById('Note').style.display = 'block'; 
 
     setTimeout(function(){ 
 
     \t document.getElementById('Note').style.display = 'none'; 
 
     }, 5000); // after 5 secs 
 
    } 
 
    
 
    document.onmouseup = ShowNote; 
 
    if (!document.all) document.captureEvents(Event.MOUSEUP);

I DON'T want it to show when I highlight this text<br /> 
 
    I DO want it to show when I highlight this text. 
 
    <div type='text' id='Note' style="display:none;" >HIDDEN DIV CONTENT</div>

变化：

您需要检查什么是通过 “window.getSelection（）” 函数突出。
你是传递一个字符串的setTimeout
隐藏的是不是一个有效的显示选项，都不是

所以，你知道，这是一般不好的做法只是有文字漂浮的标签之外。所以最好将你的前两行标签粘贴在<p>标签中。

来源

2017-02-01 23:15:05 Glitcher

谢谢编辑芜菁 – Glitcher

点我的，反了p的。这就是说，对吧？：p – Turnip

这是我为你所做的。我设置间隔。这种情况在每次鼠标移出时都会发生。或者更好的方法是检查它是否是div的样式是页面上的块。希望这有助于 Live exapmle on Codepen

var target = document.getElementById('note'); 

var i = setInterval(function(){ 
    if (document.getElementById("note").style.display == 'block') { 
    hide(); 
    } 
}, 5000); 

function showNote() { 
    target.style.display = 'block'; 
} 
function hide(){ 
document.getElementById("note").style.display = "none"; 
}

来源

2017-02-02 00:09:30

在高亮显示DIV然后隐藏

回答

相关问题