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

Question

你好我有一个颜色输入，我想将它存储在我的数据库中，但它有默认值黑色我怎样才能将它更改为空？我删除了值 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-* 属性，然后在您的输入值至少更改一次后更新它。

在我的代码片段中，实际值是在单击输入后立即设置的（因此，如果您单击它而不更改末尾的颜色，它将 return 您 #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>

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

how to set value of color input on null

html

javascript

css

selector