Uncaught TypeError работает код для заполнения поля формы на другой странице html - PullRequest
0 голосов
/ 24 марта 2020

Я пытался использовать пример отсюда:

https://developer.mozilla.org/en-US/docs/Web/API/Document/forms

для моих собственных нужд.

Приведенный выше пример доступа форма на той же странице. Мой пример пытается заполнить поле на другой странице.

Вот пусковая установка html - пусковая установка. html:

<!DOCTYPE HTML>
<html>
<head>
<title>Launcher page</title>
<script>
function launch(text) {
    window.open("http://localhost/page2.html", '_blank');
    let entryform = window.document.forms.newentry;
    entryform.elements.town.placeholder = text; 
    window.focus();
}

</script>

</head>
<body>
<p>Click button to launch page2 and populate edit box on form</p>
<button type="button" id="launcher" onclick="launch('Edinburgh')">populate a text field on a different page</button>
</body>
</html>

И запущенная страница - page2. html:

<!DOCTYPE html>
<html>
 <head>
   <title>Page 2</title>
 </head>
 <body>
  <header>
     <h1>This page launched from launcher.html</h1>
  </header>

  <main>
    <form name="newentry">
      <p>Town: </p><input type="text" name="town" value="">
    </form>
  </main>
 </body>
</html>

Но когда я нажимаю кнопку на панели запуска. html Я получаю сообщение об ошибке на панели запуска. html page:

entryform.elements.town.placeholder = text;

Uncaught TypeError: Cannot read property 'elements' of undefined
  at launch (launcher.html:10)
  at HTMLButtonElement.onclick (launcher.html:20)

Почему это свойство элементов undefined?

Как я могу это исправить?

EDIT То, что я действительно хотел сделать, было просто, но возвращенный объект window.open не был готов в момент, когда я пытался редактировать. Действительно простое решение выглядит так:

function launch(text) {
    let p2win = window.open('page2.html', '_blank');
    p2win.onload = function(){
        p2win.document.forms.newentry.town.value = text;
    }
}

1 Ответ

0 голосов
/ 24 марта 2020

Ваша проблема в том, что этот код ...

let entryform = window.document.forms.newentry;

ищет в окне current (ie launcher.html) элемент формы. Вместо этого вы можете сохранить ссылку на всплывающее окно и получить доступ к его элементам через эту ссылку.

let popup = window.open("http://localhost/page2.html", '_blank')
let entryform = popoup.document.forms.newentry
// and so on

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

Например,

window.open(`page2.html?placeholder=${encodeURIComponent(text)}`, '_blank')

, а затем в page2.html ...

<main>
  <form name="newentry">
    <p>Town: </p><input type="text" name="town" value="">
   </form>
</main>
<script>
let query = new URLSearchParams(location.search)
document.querySelector('form[name="newentry"] input[name="town"]')
  .placeholder = query.get('placeholder')
</script>

Демо-версия ~ https://codesandbox.io/s/determined-archimedes-51vn2

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...