javascript - 如何在 null 上设置颜色输入的值

Question

嗨，我有一个颜色输入，我想将它存储在我的数据库中为 null，但它具有默认值黑色，如何将其更改为 null？我删除了值 att 但它仍然具有默认值

    <input class="form-control h-50px" type="color" id="example-color-input" name="color_2">

Answer 1

您可以尝试添加 defaultValue 属性。 https://www.w3schools.com/jsref/prop_color_defaultvalue.asp

Answer 2

您可以data-*向输入添加一个没有值的属性，然后在输入的值至少更改一次时更新它。

在我的代码段中，一旦单击输入，就会设置实际值（因此，如果您单击它而不最后更改颜色，它将返回您#000000）。通过删除click事件来删除此行为。

该按钮只是记录输入的值。

document.addEventListener('DOMContentLoaded', () => {
  // INPUT
  const eInput = document.querySelector('input'),
    inputEvent =  () => eInput.dataset.realValue = eInput.value;
  
  eInput.addEventListener('click', inputEvent);
  eInput.addEventListener('change', inputEvent);
  
  // LOG BTN
  const eBtn = document.querySelector('button');
  
  eBtn.addEventListener('click', () => console.log(getColorInputValue(eInput)));
});

/**
 * @param {HTMLElement} element
 * @returns {string|null}
 */
function getColorInputValue(element) {
  return element.dataset.realValue;
}

<input type="color" data-real-value="">

<button>Get color</button>