Lockal Storage и Chrom

[Konstantin47]

Здравствуйте!
Такой вопрос, сохранение работает в Мозиле, но не работает в Chrom
и в Opere, почему?

что может быть не так?


Cпасибо

<table>
	<tr><th scope="col">Nazwę</th>
	    <th scope="col" >Opis</th>
		<th scope="col">&nbsp;</th>
		</tr>
		
		 <tr>
		
		 <td>
                    <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
				</tr>
				<tr>
				<td>
		 <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
		
	</tr>
	<tr>
	<td>
		 <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
		
	</tr>
	<tr><td>
	 <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
	</tr>
	<tr>
	<td>
		 <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
		
	</tr>
	<tr> <td>
	 <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
		
	</tr>
	<tr>
	<td>
		 <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
	</tr>
	<tr><td>
	 <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
	</tr>
	<tr>
	<td>
		 <label>
                        <input type="text" name="text" ">
                    </label>
					
                </td>
                <td>
                    <label>
                       <input type="text" name="text" ">
                    </label>
                </td>
				</div>
				 <div class="item_box">
		
	</tr>
	 <div id="cart_content"></div>
</div>	
</table>
</body>

let div = document.getElementById('div');
div.addEventListener('click', changeValue);
div.addEventListener('blur', changeEnd);

function changeValue(event){
  let target = event.target;
  target.setAttribute('contenteditable', true);
}

function changeEnd(){
  div.removeAttribute('contenteditable');
  console.log(div.innerText)
}


// Получаем данные из LocalStorage
function getCartData(){
	return JSON.parse(localStorage.getItem('cart'));
}
// Записываем данные в LocalStorage
function setCartData(o){
	localStorage.setItem('cart', JSON.stringify(o));
	return false;
	</script>

[рони]

что может быть не так?

проверьте на сервере свой код.

[Konstantin47]

с разрешения, покажу свою логику поиска проблемы:
1. понял я, как посмотреть в браузерах хранилище и ключи, код упростил до только сохранить и вернуть

localStorage.setItem('div',changeValue);

	localStorage.getItem('div ');

Но вопрос

вот происходит у меня событие ( смысл всего, в ячейки таблицы писать текст и чтобы не пропадал). Значения события у меня - changeValue,
но почему не сохраняет значение - я уже перепробовал вообще все названия блоков от input до просто table

По моему мнению - раз все события происходят в главном блоке с id номером - div
(уже думал путаница из-за имени, тоже менял)

- там по клику мышки активируется возможность интерактивной ячейки и происходит событие, то чтобы текущую надпись запомнить - localStorage.setItem('div',changeValue);
но это все снова работает только в Мозиле, или так вообще нельзя делать?
ps я пока сам не понимаю, каким местом, читаю инструкцию - записать, показать вижу, а - что сохраняем, и значение его - а толку - видите

[рони]

Konstantin47,
структуру таблицы неплохо бы исправить, выкинуть все div или переместить их в ячейки td.

[рони]

Konstantin47,
на всякий случай

Редактирование текста ячеек таблицы с сохранением

[Konstantin47]

Рони, спасибо большое!

[Konstantin47]

<body>

 <table id='div'>


   <tr>
   
   <th scope="col">Nazwę</th>
   <th scope="col" >Opis</th>
   <th scope="col">&nbsp;</th>
		
		
   </tr>
		
   <tr>

     <td>1234</td>

     <td>1234</td>
	 
	 <td>1234</td>

   </tr>

   <tr>

     <td>1234</td>

     <td>1234</td>
	 
	 <td>1234</td>

   </tr>

   <tr>

     <td>1234</td>

     <td>1234</td>
	 
	 <td>1234</td>

   </tr>

 </table>

почти по примеру сделал таблицу

хорошо, а в таком случае - key для сохранения - ячейка или td будет?
мне, чтоб хоть одно точное значение знать

с моим старым кодом, точно также не работает

[рони]

Konstantin47,
не понимаю что вы пишите, ни код, ни описание, могу только гадать, что вы хотите сделать.

[Konstantin47]

щас

<body>

 <table id='div'>


   <tr>
   
   <th scope="col">Nazwę</th>
   <th scope="col" >Opis</th>
   <th scope="col">&nbsp;</th>
		
		
   </tr>
		
   <tr>

     <td>1234</td>

     <td>1234</td>
	 
	 <td>1234</td>

   </tr>

   <tr>

     <td>1234</td>

     <td>1234</td>
	 
	 <td>1234</td>

   </tr>

   <tr>

     <td>1234</td>

     <td>1234</td>
	 
	 <td>1234</td>

   </tr>

 </table>
 
</body>

let div = document.getElementById('div');
div.addEventListener('click', changeValue);
div.addEventListener('blur', changeEnd);
  console.log(div);

function changeValue(event){
  let target = event.target;
  target.setAttribute('contenteditable', true);
  
}


function changeEnd(){
  div.removeAttribute('contenteditable');
  console.log(div.innerText)
}


   localStorage.setItem('div',changeValue);
   localStorage.getItem('div');

Если запустить будет, похоже, как у вас - таблица с активными ячейками
Cейчас хочу только, чтоб сохраняло данные LokalStorage в ячейках
(все, что показывал выше работало только в Мазиле)

[voraa]

Вы чего сохранить то пытаетесь?
localStorage.setItem('div',changeValue); - это вы саму функцию туда пытаетесь засунуть. Она конечно как то в строку преобразуется вот в таком виде
"function changeValue(event){
let target = event.target;
target.setAttribute('contenteditable', true);

}"
Но это явно не то, что вам надо.