提问人：John 提问时间：5/18/2012 最后编辑：John 更新时间：10/19/2023 访问量：1596
HTML5 输入类型的范围和颜色不能为空。如果它们镜像的数据库列为 null，该怎么办？
HTML5 input type of range and color can't be empty. What if the database column they are mirroring is null?
问：
在相对较新的 HTML 表单控件中，有“type=range”和“type=color”控件。该规范指出，当提交包含此类控件的表单时，将始终为这些控件提交一个值。它们永远不会是空的。
这与 type=text 控件和其他类似控件不同，后者的值确实可以是空字符串。
似乎不可能使用范围和颜色控件来反映数据库中可为 null 的列的状态。
有什么解决方法吗？
编辑：行为由以下链接指定：HTML5规范
答：
0赞
RickyAYoder
7/13/2015
#1
对于范围，您可以将范围的值设置为越界的数字（当然，如果您希望用户不要弄乱它）：
var range = document.getElementById('rangeInput');
//let's say your range is 0-10
rangeInput.style.display = 'none';
range.min = -1;
range.value = -1;
//-1 would be your "null" value
//now, if you wanted the user to be able to edit the null range...
range.style.display = '';
range.addEventListener('change',function(){
if(this.value < 0) this.value = 0;
//this should keep people from setting it to "null"
});
我仍然不确定您将如何为颜色输入执行此操作，因为它没有“越界”。
0赞
David
10/19/2023
#2
从实践和语义上讲，通常意味着“没有设置任何值，因此使用默认值”。由于存在一个值（即使不在相关记录中），因此可以将该值指定给输入的初始状态。NULL
不变的范围或颜色输入可以使用自定义样式来反映其未设置状态（例如，降低不透明度）。要重置范围，默认范围位置 0%、100% 或 50% 可能会直观地解决大多数情况（无需添加重置按钮）。对于颜色输入，任何具有 0% alpha 的颜色（例如，或或）都可以是重置（无需添加重置按钮）。transparent#00000000hsla(20,50%,80%,0%)
就像用于切换“关闭”某些内容的复选框一样，后端验证执行最后一步，将默认值转换为 .SET input_field=NULL
评论
value="#"#