Пользовательское значение ввода не сохраняется в поле ввода формы с помощью JS?

Question

[PainDead]

input class="inp b_Budget" value="99.97" data-id="20"

Сразу говорю нуб в программировании .Есть значение равное 99.97 . Когда я вручную с помощью клавиатуры ввожу другое значение например: 20 и нажимаю клавишу TAB или щелкаю в любом месте веб-страницы значение обрабатывается даже если перезагрузить страницу оно остается

var s = document.getElementsByClassName('inp b_Budget')[0].setAttribute('value', 20);

В чем соль то когда методом что выше даю значение 20 оно отображается в строке ввода но стоит перезагрузить страницу все опять сбрасывается к 99.97. Пожалуйста подскажите как решить проблему

Answer 1

[Julia Ovod]

Дело в том, что с помощью вашего метода значение сохраняется ровно до того момента, как перезагрузится страница. Когда вы каждый раз открываете страницу, то у вас значение 99.97 отображается только потому, что в HTML для элемента input вы изначально его указали в атрибуте.

Если вам нужно сохранить значение и после перезагрузки страницы, то используйте Cookie или Local Storage.

Comments

[PainDead]

оба метода не работают у меня(
для справки я дополняю чужое расширение для хром под себя.

[Julia Ovod]

PainDead, Покажите как используете методы? Попробую вам помочь)

[PainDead]

Спасибо)
ну вот куки
var coc = document.cookie = end1;
var saved = document.getElementsByClassName('inp b_Budget')[che].setAttribute('value', coc);
end1 там число.могу укинуть полный код но там треш)я если что в прямом смысле не знаком с программированием но мне нужно улучшить расширение чтоб проще было))

[Julia Ovod]

PainDead, Посмотрите пример, реализовала вашу логику.

[PainDead]

Julia Ovod, т.е. нужно нажимать чтоб сохранить?

[Julia Ovod]

PainDead, В моем примере да. Если вам нужно, чтобы значение сохранялось автоматически после окончания введения значения или потери фокуса на поле ввода, то для первого используйте debounce, для второго просто на событии blur сохраняйте так же значение.

Вам нужна будет помощь или попробуете самостоятельно решить?

[PainDead]

Julia Ovod, значит будет работать без ручного ввода чисто через скрипт.Если у вас есть время можете мне помочь.

[Julia Ovod]

Помогу, только давайте еще раз уточним, вам нужно сохранять значение после окончания ввода и на событии blur, так?

[PainDead]

Да вот на скрине видно js получает значение с orders прибавляя +1% и вписывает его в колонку Budget тем самым как я бы вписал значение вручную и нажал к примеру Tab
Скрин для примера там я уже от руки вписал в колонку Budget так там к примеру число 20

[Julia Ovod]

PainDead, Посмотрите пример, добавила debounce и blur.

[PainDead]

Julia Ovod, Очень большое спасибо вам!!!)Надеюсь заработает)Еще раз спасибо за ваше потраченное время)

[Julia Ovod]

PainDead, Пожалуйста :-)

[PainDead]

Julia Ovod, Эхх ладно я попробовал для меня это очень сложно мне бы что проще просто я слишком тупой...вообщем ничего не вышло....

[Julia Ovod]

PainDead, Что же у вас там такое? Ошибки какие-то или просто не получается разобраться в коде?

[PainDead]

Julia Ovod, Да у меня не выходит разобраться в коде просто сам я себе примитивный код написал.Даа и с клавиатуры ввода у меня по дефолту итак сохраняет числа как с куки но когда задаю число через скрипт ничего не сохраняет

[PainDead]

Julia Ovod, Вот тут нашел статью

https://progi.pro/polzovatelskoe-znachenie-vvoda-n...

Проблема такая же но решение там не работает все равно я кликаю по другому элементу вписывает на старое значение новое ну и когда перезагружаю страницу не сохраняет

[Julia Ovod]

Если честно, я вас до конца не понимаю, вроде данный пример полностью отвечает вашим требованиям и решает задачу.

Если вам тяжело разобраться в коде, то тут я бессильна, почитайте MDN или Learn JavaScript.

[PainDead]

Julia Ovod, думал все проще будет . только это нужно было ...застрял на тупущей мелочи. придется кликером по 500 строк нажимать добавлять пробелы после авто ввода цифр

[Julia Ovod]

PainDead, А зачем добавлять пробелы, если есть debounce? И значение ведь сохраняется. На каждую новую строчку в JS выделяется память (в JS строки неизменяемы), уж лучше через debounce.

[PainDead]

последний вопрос не по теме можно как то сделать чтоб в скобках [ ] указать последовательность строк . чтоб не писать новый код для каждой строки . просто каждая строка меняет значение в скобках [ ]

document.getElementsByClassName('inp b_Budget')[1]

[PainDead]

вот что я обнаружил расширение использует web sql и там нашел те данные которые у меня дефолтные