我試圖使用這里的示例：https://developer.mozilla.org/en-US/docs/Web/API/Document/forms供我自己使用。上面的示例是訪問同一頁面上的表單。我的示例嘗試填充不同頁面上的字段。這是啟動(dòng)器 html - launcher.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>以及啟動(dòng)的頁面 - 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>但是，當(dāng)我單擊 launcher.html 上的按鈕時(shí)，launcher.html 頁面上出現(xiàn)錯(cuò)誤：entryform.elements.town.placeholder = text;Uncaught TypeError: Cannot read property 'elements' of undefined at launch (launcher.html:10) at HTMLButtonElement.onclick (launcher.html:20)為什么這個(gè)元素屬性未定義？我怎樣才能解決這個(gè)問題？編輯我真正想做的很簡(jiǎn)單，但是返回的 window.open 對(duì)象在我嘗試編輯時(shí)尚未準(zhǔn)備好。真正簡(jiǎn)單的解決方案是這樣的：function launch(text) { let p2win = window.open('page2.html', '_blank'); p2win.onload = function(){ p2win.document.forms.newentry.town.value = text; }}
1 回答
慕慕森
TA貢獻(xiàn)1856條經(jīng)驗(yàn) 獲得超17個(gè)贊
你的問題是這段代碼...
let entryform = window.document.forms.newentry;
正在當(dāng)前窗口（即launcher.html）中查找表單元素。您可以做的是保存對(duì)彈出窗口的引用并通過該引用訪問其元素。
let popup = window.open("http://localhost/page2.html", '_blank')
let entryform = popoup.document.forms.newentry
// and so on
作為替代方案，我會(huì)考慮將查詢參數(shù)傳遞到彈出頁面，而不是嘗試在外部操作它。
例如
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>
現(xiàn)場(chǎng)演示 ~ https://codesandbox.io/s/dependent-archimedes-51vn2
- 1 回答
- 0 關(guān)注
- 97 瀏覽
添加回答
舉報(bào)
0/150
提交
取消