时间戳

首页 > 解决方案 > 隐藏的侧边菜单和 HTML5 颜色冲突

javascript - 隐藏的侧边菜单和 HTML5 颜色冲突

问题描述

我有一个侧边菜单，通过单击图标隐藏和控制：

  <a href="#" onclick="openMenuNav()" title="open menu" id="openmenu"><i class="fa fa-caret-square-left" style="font-size:18px"></i></span>

openMenuNav() 如下：

function openMenuNav() {
document.getElementById("mySidenav").style.width = "250px";
document.getElementById("main").style.marginLeft = "250px";
document.body.style.backgroundColor = "rgba(0,0,0,0.4 )";
}

这个功能很好，除非我有一个输入类型为颜色的表单，它会打开标准颜色对话框和侧边菜单。

调用颜色的代码是

<input type="color" id="flat" name="colour" value="#000000" data-alias="" style="width:80px">

我将不胜感激解决方案！

标签： javascripthtmlcolor-picker

解决方案

用于preventDefault防止它的默认操作。

document.querySelector('input').addEventListener('click', function(e) {
  e.preventDefault();
});
<input type="color" id="flat" name="colour" value="#000000" data-alias="" style="width:80px">

推荐阅读