Различают ли отображаемое значение входного тега и фактическое значение (сохраненное в атрибуте значения)?

Question

Для некоторых функций я хочу, чтобы мое фактическое значение и отображаемое значение были разными. Есть ли способ через JS сделать это?

Один из методов - взять другой тег ввода с тем же именем / идентификатором, но скрытым.

Answer 1

вы можете иметь пользовательский атрибут в вашем элементе управления UI. Если вы говорите о входном теге, то он выглядит так:

<input type='text' id='txt' value='Display Value' data-custattr='Actual Value' />

при чтении значения вы можете получить фактическое значение, например:

document.getElementById('txt').getAttribute('data-custattr')

Надеюсь, это поможет.

Answer 2

РЕДАКТИРОВАТЬ: вероятно, я бы сделал это, прикрепив некоторый javascript перед отправкой и слушатель события к входу, если это необходимо для облегчения состояния свойства, например, если вы хотите, чтобы свойство было пользовательским, а не 'value«вам нужен прослушиватель событий при« изменении », который будет обновлять ваше пользовательское свойство.

Что-то вроде:

    element.addEventListener('change', () => {
    element.setAttribute('myAttrName', element.value);
});

Главное здесь то, что вам не нужнодополнительные элементы, скорее всего несколько строчек js.