我在这里和Internet上搜索了可以重新启用onClick代码中已禁用的onMouseOut的代码。我发现了什么，但在我所处的环境中什么也没有。
在页面上有一个容器div，其中包含两个div，一个div用于图像，另一个div用于对应的文本。在图像下方是四个链接（1、2、3、4），它们以无序列表的形式排列。当访客将鼠标悬停在＃2上时，图像需要更改为img2，匹配的文本div需要从“隐藏”变为“显示”。 onMouseOut将图像和文本重置为原始版本。 onClick将图像/文本更改为单击的＃号，然后禁用onMouseOut。
现在，我需要一种使访客下次将鼠标移到该#link上时再次使onMOuseOut工作的方法。现在，一旦禁用了onMouseOut，它将一直保持禁用状态，直到我重新加载页面为止。
这是到目前为止的代码：
<head>
<script>
if (document.images) {
book1 = new Image
book2 = new Image
book3 = new Image
book4 = new Image
book1.src = "/llb/assets/book1.jpg"
book2.src = "/llb/assets/book2.jpg"
book3.src = "/llb/assets/book3.jpg"
book4.src = "/llb/assets/book4.jpg"
}
function swapImage(thisImage,newImage) {
if (document.images) {
document[thisImage].src = eval(newImage + ".src")
}
}
function show_visibility(IDS){
hide_visibility();
document.getElementById(IDS).style.display = 'block';
}
function hide_visibility(){
var sel = document.getElementById('bookleadin').getElementsByTagName('div');
for (var i=0; i<sel.length; i++) { sel[i].style.display = 'none'; }
}
</script>
</head>
<body>
<div id="content">
<div id="books">
<div id="bookimages">
<img id="bookcover" name="bookcover" src="../llb/assets/book1.jpg" />
<ul>
<li><a href="#" onclick="swapImage('bookcover','book1'); show_visibility('bt1'); this.onmouseout=''" onMouseOver="swapImage('bookcover','book1')" onMouseOut="swapImage('bookcover','book1')">1</a></li>
<li><a href="#" onclick="swapImage('bookcover','book2'); show_visibility('bt2'); this.onmouseout=''" onMouseOver="swapImage('bookcover','book2')" onMouseOut="swapImage('bookcover','book1')">2</a></li>
<li><a href="#" onclick="show_visibility('bt3'); swapImage('bookcover','book3')" onMouseOver="swapImage('bookcover','book3')" onMouseOut="swapImage('bookcover','book1')" onclick="swapImage('bookcover','book3')">3</a></li>
<li><a href="#" onclick="show_visibility('bt4'); swapImage('bookcover','book4')" onMouseOver="swapImage('bookcover','book4')" onMouseOut="swapImage('bookcover','book1')" onclick="swapImage('bookcover','book4')">4</a></li>
</ul>
</div><!-- end bookimages -->
<div id="bookleadin">
<div id="bt1" style="display:block;"><p>Writing starts with living...</p>
</div>
<div id="bt2" style="display:none;"><p>The air is silk...</p>
</div>
<div id="bt3" style="display:none;"><p>I lived in the woods...</p>
</div>
<div id="bt4" style="display:none;"><p>I tried to forget...</p>
</div>
</div><!-- end bookleadin -->
<div class="spacer"></div>
</div><!-- ends books -->
</div><!-- end content -->
清单2是我正在测试的示例。我仍然是javascript初学者/中级，因此任何答案都必须足够简单，我才能理解并应用于该项目或完成该项目，以便我可以复制/粘贴该项目。
预先感谢您提供的任何帮助。
最佳答案
如果单击了onclick，则可以在onmouseout处设置一个标志以进行验证，如果是，则交换this.onmouseout = ""，否则不执行任何操作，但不执行。
编辑：
<head>
<script>
if(document.images) {
book1 = new Image
book2 = new Image
book3 = new Image
book4 = new Image
book1.src = "/llb/assets/book1.jpg"
book2.src = "/llb/assets/book2.jpg"
book3.src = "/llb/assets/book3.jpg"
book4.src = "/llb/assets/book4.jpg"
}
var swap_list = {}; // a list of swapped elements
function swapImage(thisImage, newImage) {
if(typeof swap_list[thisImage] == 'undefined' || swap_list[thisImage]=='')
if(document.images) {
document[thisImage].src = eval(newImage + ".src");
swap_list[thisImage] = newImage;
}
else
{
swap_list[thisImage] = '';
document[thisImage].src = "../llb/assets/book1.jpg";
}
}
function show_visibility(IDS) {
hide_visibility();
document.getElementById(IDS).style.display = 'block';
}
function hide_visibility() {
var sel = document.getElementById('bookleadin').getElementsByTagName('div');
for(var i = 0; i < sel.length; i++) {
sel[i].style.display = 'none';
}
}
</script>
</head>
<body>
<div id="content">
<div id="books">
<div id="bookimages">
<img id="bookcover" name="bookcover" src="../llb/assets/book1.jpg" />
<ul>
<li>
<a href="#" onclick="swapImage('bookcover','book1'); show_visibility('bt1'); " onMouseOver="swapImage('bookcover','book1')" onMouseOut="swapImage('bookcover','book1')">1</a>
</li>
<li>
<a href="#" onclick="swapImage('bookcover','book2'); show_visibility('bt2'); " onMouseOver="swapImage('bookcover','book2')" onMouseOut="swapImage('bookcover','book1')">2</a>
</li>
<li>
<a href="#" onclick="show_visibility('bt3'); swapImage('bookcover','book3')" onMouseOver="swapImage('bookcover','book3')" onMouseOut="swapImage('bookcover','book1')" onclick="swapImage('bookcover','book3')">3</a>
</li>
<li>
<a href="#" onclick="show_visibility('bt4'); swapImage('bookcover','book4')" onMouseOver="swapImage('bookcover','book4')" onMouseOut="swapImage('bookcover','book1')" onclick="swapImage('bookcover','book4')">4</a>
</li>
</ul>
</div><!-- end bookimages -->
<div id="bookleadin">
<div id="bt1" style="display:block;">
<p>
Writing starts with living...
</p>
</div>
<div id="bt2" style="display:none;">
<p>
The air is silk...
</p>
</div>
<div id="bt3" style="display:none;">
<p>
I lived in the woods...
</p>
</div>
<div id="bt4" style="display:none;">
<p>
I tried to forget...
</p>
</div>
</div><!-- end bookleadin -->
<div class="spacer"></div>
</div><!-- ends books -->
</div><!-- end content -->
</body>
关于javascript - 需要重新启用在onclick事件中禁用的onmouseout，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8748760/