Javascript как Crud значение ключа массива пара в строку

Question

мне нужно хранить ключевой массив значений в поле, как это:

<input type="text" id="test" >{key1="a"}{key2="b"}</input> 

Как я могу читать и обновлять?

Answer 1

Ваш тег ввода недействителен; он должен быть самозакрывающимся.

То есть, я бы хранить данные в виде data- * атрибутов с JSON внутри:

<input data-val='{ "key1": "a", "key2": "b"}' type="text" id="test" /> 

Оттуда вы можете прочитать значение, разобрать его, обновить его, stringify его обратно, и обновление атрибут.

---

Что-то, как это должно вам начать, просто отметим, что некоторые из них сломается в старых браузерах, так что вы, возможно, придется Призонная шайба вещи, как JSON.parse/stringify. И подумать об этом, getAttribute и setAttribute не поддерживаются в IE7. Я не уверен, что обходной путь для этих браузеров.

var inp = document.getElementById('test'); 
var obj = JSON.parse(inp.getAttribute('data-val')); 

console.log(obj); 

obj.key1 = "updated"; 
obj.key3 = "foo"; 

inp.setAttribute('data-val', JSON.stringify(obj)); 

console.log("updated", inp.getAttribute('data-val')); 

DEMO