在高亮顯示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然後隱藏

回答

相關問題