Javascript 关闭jQuery中的模式弹出窗口

我有一个图像，点击后会显示一个模式。如果我在模式窗口外单击，它会很好地关闭，但是如果我单击我在

span

标记中添加的

X

，它不会关闭。任何帮助都将不胜感激

var modal=document.getElementById（“myModal1”）；
var btn=document.getElementById（“myBtn1”）；
var span=document.getElementsByClassName（“关闭”）[0]；
//当用户单击该按钮时，打开模式对话框
btn.onclick=函数（）{
modal.style.display=“块”；
}
//当用户单击（x）时，关闭模式对话框
span.onclick=函数（）{
modal.style.display=“无”；
}
//当用户单击模式之外的任何位置时，将其关闭
window.onclick=函数（事件）{
如果（event.target==模态）{
modal.style.display=“无”；
}
}

&时代；
模态中的一些文本。。
更多模态文本。。。

以下是一个完整的示例，说明您在寻找什么

var modal=document.getElementById（“myModal1”）；
var btn=document.getElementById（“myBtn1”）；
var close=document.querySelector（“myModal1.close”）；
//当用户单击模式之外的任何位置时，将其关闭
btn.addEventListener（“单击”，函数（）{
modal.style.display=“块”；
}) 
close.addEventListener（“单击”，函数（）{
modal.style.display=“无”；
}) 
window.addEventListener（“单击”，函数（e）{
内部常数=模态包含（如目标）；
如果（！inside&&e.target！==btn）{
modal.style.display=“无”；
}
})

.modal{display:none}

点击
&时代；
模态中的一些文本。。
更多模态文本。。。

以下是一个完整的示例，说明您在寻找什么

var modal=document.getElementById（“myModal1”）；
var btn=document.getElementById（“myBtn1”）；
var close=document.querySelector（“myModal1.close”）；
//当用户单击模式之外的任何位置时，将其关闭
btn.addEventListener（“单击”，函数（）{
modal.style.display=“块”；
}) 
close.addEventListener（“单击”，函数（）{
modal.style.display=“无”；
}) 
window.addEventListener（“单击”，函数（e）{
内部常数=模态包含（如目标）；
如果（！inside&&e.target！==btn）{
modal.style.display=“无”；
}
})

.modal{display:none}

点击
&时代；
模态中的一些文本。。
更多模态文本。。。

问题中的代码可以正常工作。我只能假设在实际的HTML页面中有不止一个

.close

元素，而与模式相关的元素不是第一个。还要注意，我重新标记了这个问题，因为这与jQuery无关。这是纯JS。@Rorymcrossan它并没有像预期的那样工作。有关完整版本的信息，请参见我的答案您问题中的代码运行良好。我只能假设在实际的HTML页面中有不止一个

.close

元素，而与模式相关的元素不是第一个。还要注意，我重新标记了这个问题，因为这与jQuery无关。这是纯JS。@Rorymcrossan它并没有像预期的那样工作。有关完整版本，请参见我的答案