2015-04-11 6 views
0

все еще изучая некоторые javascript здесь, сделали другие вещи, но теперь последнюю и самую важную его часть.Измените div на другой странице html

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

Так что я уже создал функцию для извлечения массива значений.

function getElementArray(divName){ 
    var names = document.getElementsByName("namefield"); 
} 

Имена переменных - это массив, и он имеет все значения из полей.

Проблема в том, что я хотел бы установить эти значения из массива в значения другого div на странице. После некоторых поисков я понял, что это можно сделать с помощью «id'-s», но я не уверен и не совсем понимаю, как это сделать.

Предположим, у меня есть много div на другой странице (table.html), но некоторые из них имеют id = "MAIN". Я хотел бы изменить значение внутри DIV

Например

<div id="MAIN">THIS PART I WANT TO CHANGE</div> 

Javascript не является частью моей школьной системы и я сделал CodeAcademy учебники и это самое я получил об этом, Надеюсь, вы, ребята, можете помочь с моей проблемой.

ответ

1

Имена переменных - это массив, и он имеет все значения из полей.

function getElementArray(divName){ 
    var names = document.getElementsByName("namefield"); 
} 

Нет, вы только получили ссылки на элементы здесь. У вас еще нет такой ценности.

Вы можете получить значения перебирая названия Nodelist массива и использовать names[i].value

Проблемы Я хотел бы установить эти значения из массива в значений другого DIV на странице

Если это будет на той же странице, используйте свойство innerHTML или textContent объекта DOM, чтобы присвоить значение.

document.getElementById("MAIN").textContent= names[1].value; 

Просто для демо цели я использую names[1] здесь, так что она будет загружать второе значение входного сигнала.

Допустим, у меня есть много Div на другой странице (table.html), но некоторые из них есть ID = «MAIN».Я хотел бы изменить значение внутри div

Как только вы перейдете на другую страницу, состояние javascript будет потеряно. Таким образом, у вас не будет доступа к names внутри этой страницы.

Либо вы должны сохранить значения в localStorage и получить их на следующей странице.

Иначе добавьте значения в строку query вашего URL-адреса и извлеките его там.

Edit: Обновление на основе комментариев

Допустим, у вас есть var names = document.getElementsByName("namefield"); так, чтобы хранить значения внутри LocalStorage.

var myValues = [], 
    names = document.getElementsByName("namefield"); 
    for(var i = 0; i < names.length; i++) { 
     myValues.push(names[i].value); 
    } 
    localStorage.myValues = JSON.stringify(myValues); 

Теперь, если ваша следующая страница, Iinside window.onload событие:

window.onload = function() { 
     var myValues = localStorage.getItem("myValues") ? JSON.parse(localStorage.getItem("myValues")) : [], 
      divElements = document.querySelectorAll("#MAIN"); 
     for(var i =0; i < myValues.length; i++) { 
      divElements[i].textContent = myValues[i]; 
     } 
    } 
+0

Как я могу сохранить значения в localstorage? Не могли бы вы привести краткий пример в редактировании и как его получить на следующей странице. – shawwy

+0

Обновленный ответ :) – mohamedrias

+0

Я попробую это, когда я вернусь домой и отчитаюсь, спасибо, если возникнут какие-либо проблемы, я буду комментировать .. – shawwy

0

Если вы хотите установить или изменить содержимое элемента, вы можете использовать свойство innerHTML.

Так что в вашем случае, document.getElementById("MAIN").innerHTML = "Whatever you want";

Для записи, names в вашем примере технически не является массивом, а NodeList. См. https://developer.mozilla.org/en/docs/Web/API/NodeList#Why_is_NodeList_not_an_Array.3F.

+0

да, но как я мог бы передать его на другую страницу? Функция вызывается нажатием кнопки в genmain.html, но элемент находится в таблице.html. – shawwy

+0

Невозможно установить содержимое одной веб-страницы из другого. Вы можете вытащить веб-страницу того же происхождения в свой javascript, используя Ajax, но это другое. –

Смежные вопросы