Javascript 显示一个方框，只要鼠标在上面，就不要使其褪色

只要鼠标在框上，就显示框及其轴

嗨 按下输入键时，将显示该框。问题是，当我试图在显示框时单击框编号时，框被隐藏

朋友们，我怎样才能解决这个问题

函数show1（）{
document.getElementById（“box1”）.style.display=“block”
}
函数hide（）{
document.getElementById（“box1”）.style.display=“无”
}
函数volcal（a）{
document.querySelector（“#number”）.value=a
}

#编号{
不透明度：30%；
填充：3倍；
}
#号码：悬停{
不透明度：100%；
边框颜色：#ff0000；
边框宽度：1px；
颜色：#0064ff；
}
#框1{
显示：无；
宽度：30.5%；
右边距：13px；
填充：3倍；
文本对齐：居中；
边框样式：实心；
边框颜色：#3b3b；
}

值=
1,000
| 
10,000

您可以单击填充整个屏幕的透明背景div，而不是使用鼠标退出事件来隐藏元素，因此当您在框外单击时，将隐藏该元素

函数show1（）{
document.getElementById（“box1”）.style.display=“block”；
document.getElementById（“back-layer1”）.style.display=“block”；
}
函数hide（）{
document.getElementById（“box1”）.style.display=“无”；
document.getElementById（“back-layer1”）.style.display=“无”；
}
函数volcal（a）{
document.querySelector（“#number”）.value=a；
}

#编号{
不透明度：30%；
填充：3倍；
位置：相对位置；
z指数：100；
}
#号码：悬停{
不透明度：100%；
边框颜色：#ff0000；
边框宽度：1px；
颜色：#0064ff；
}
#框1{
显示：无；
宽度：30.5%；
右边距：13px；
填充：3倍；
文本对齐：居中；
边框样式：实心；
边框颜色：#3b3b；
z指数：100；
位置：相对位置；
}
#后台1{
位置：绝对位置；
左：0；
右：0；
排名：0；
底部：0；
背景色：透明；/*更改为红色以查看行为*/
z指数：10；
}

价值观=
1,000 
| 
10,000 

您能告诉我如何使用jquery编写这些代码吗@leo@BestFriday可以将显示和隐藏函数体更改为：

$（“#box1，#back-layer1”）.show（）

和

$（“#box1，#back-layer1”）.hide（）

，也可以将值分配更改为：

$（“#number”）.val（a）

。我没有编辑这个问题，因为我认为这将超出范围，但希望这能有所帮助you@BestFriday检查这把小提琴：