Javascript 如何通过jQuery引用扩展的Highslide对象

我正在尝试创建一个小功能，允许用户单击网页上的任何位置，关闭通过highslide创建的扩展图像。弹出的一个错误是，当图像无法完全展开时，您可以选择将其展开到完全大小或将其保留在浏览器的范围内，但是，我触发了highslide元素以在任何单击事件时关闭。我提出的这项工作仍然存在一些问题

<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script type="text/javascript" src="/hs/highslide/highslide-full.js"></script>
<link rel="stylesheet" type="text/css" href="/hs/highslide/highslide.css" />


<script type="text/javascript">                                                                                                                                                                                                                
var mState=false;                                                                                                                                                                                                                              
$(document).click(function() {                                                                                                                                                                                                            
  hs.Expander.prototype.onMouseOver = function() {                                                                                                                                                                                             
    mState = false;                                                                                                                                                                                                                            
    console.log('over') };                                                                                                                                                                                                                     
  hs.Expander.prototype.onMouseOut = function() {                                                                                                                                                                                              
    mState = true;                                                                                                                                                                                                                             
    console.log('out')  };                                                                                                                                                                                                                     
  console.log(mState);                                                                                                                                                                                                                         
  if (mState) hs.close();                                                                                                                                                                                                                      
}); </script>

<a href="/pub/opdc/p0000/tall.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="/pub/opdc/p0000/tall_t.jpg" alt="Highslide JS" align="right"></a>

var mState=false；
$（文档）。单击（函数（）{
hs.Expander.prototype.onMouseOver=函数（）{
mState=false；
log（'over'）}；
hs.Expander.prototype.onMouseOut=函数（）{
mState=true；
console.log（'out'）}；
console.log（mState）；
if（mState）hs.close（）；
}); 

我只是在学习java脚本/jQuery和highslide，所以我为错误的做法道歉。Console.log严格用于调试，将被删除

我的问题具体如下。我想通过jQuery引用扩展的highslide图像，这样就不必使用highslide的鼠标事件。我发现它们是不可预测的，我现在没有时间去弄清楚它们是如何工作的，为什么我看不到我想要的结果

---

希望这一切都有意义，提前感谢您提供的一切帮助。

也许我遗漏了什么，但我不明白您为什么要重新发明方向盘。Highslide JS已经内置了此功能。如果将“暗显不透明度”设置为任何非零值，单击页面上的任意位置将关闭扩展器

<script type="text/javascript">
   hs.dimmingOpacity = 0.75;
</script>
<style type="text/css">
.highslide-dimming {
    background: black;
}
</style>

hs.调光能力=0.75；
.幻灯片调光{
背景：黑色；
}

---

如果您实际上不希望背景变暗，只需将该值设置为0.0001之类的值。

也许我遗漏了什么，但我不明白您为什么要尝试重新发明轮子。Highslide JS已经内置了此功能。如果将“暗显不透明度”设置为任何非零值，单击页面上的任意位置将关闭扩展器

<script type="text/javascript">
   hs.dimmingOpacity = 0.75;
</script>
<style type="text/css">
.highslide-dimming {
    background: black;
}
</style>

hs.调光能力=0.75；
.幻灯片调光{
背景：黑色；
}

---

如果您实际上不希望背景变暗，只需将该值设置为0.0001之类的值。

对于那些对这一问题的小难题感兴趣的人来说，这是我现在在我的网站上运行的最终和活动代码，用于添加“单击关闭”功能，而不使用变暗方法

<script type="text/javascript">
  var mState=false;
  hs.Expander.prototype.onMouseOver = function() { mState = false; }
  hs.Expander.prototype.onMouseOut  = function() { mState = true;  }
  jQuery(document).click(function() {
    if (mState) {
      hs.close();
      mState = false;
    }
  } );
</script>

var mState=false；
hs.Expander.prototype.onMouseOver=function（）{mState=false；}
hs.Expander.prototype.onMouseOut=function（）{mState=true；}
jQuery（文档）。单击（函数（）{
如果（mState）{
hs.close（）；
mState=false；
}
} );

---

要使此代码正常工作，您需要使用highslide-full.js。我希望这能帮助别人，或者像我一样给你带来一些乐趣。

对于那些对这个问题的小难题感兴趣的人来说，这是我现在在我的网站上运行的最后一个活动代码，用于添加“点击关闭”功能，而不使用调光器方法

<script type="text/javascript">
  var mState=false;
  hs.Expander.prototype.onMouseOver = function() { mState = false; }
  hs.Expander.prototype.onMouseOut  = function() { mState = true;  }
  jQuery(document).click(function() {
    if (mState) {
      hs.close();
      mState = false;
    }
  } );
</script>

var mState=false；
hs.Expander.prototype.onMouseOver=function（）{mState=false；}
hs.Expander.prototype.onMouseOut=function（）{mState=true；}
jQuery（文档）。单击（函数（）{
如果（mState）{
hs.close（）；
mState=false；
}
} );

---

要使此代码正常工作，您需要使用highslide-full.js。我希望这能帮助别人，或者像我一样给你带来一些乐趣。

以下是你如何做到这一点，而不必将jQuery拖入其中，只需使用jsp提供的工具