gpt4 book ai didi

javascript - 更改元素文本不起作用

转载 作者:行者123 更新时间:2023-11-30 08:51:36 24 4
gpt4 key购买 nike

这似乎总是一个问题,我不明白为什么,我试图通过使用他的 ID 来更改元素 p 文本,元素 p id="para1" 位于 PostEditor.html 内:

我要更改的元素ID是以下html中的para1:

     <!DOCTYPE html>
<html>
<head>
<title>Editor</title>
<link href="styles/editor.css" rel="stylesheet" type="text/css" media="screen" />
<script src="scripts/mainScript.js"> </script>
</head>
<body>
<!-- Input fields -->
<div class="center">
<form id=caller method="post">
<p id="para1" class="text"><Strong>Post your message</Strong></p>
<textarea id="textEditor" rows="16" cols="34" name="content"></textarea>
<input type="submit" onclick="urlLoader('caller','posthandler.php')" value="Post">
</form>
</div>
<!-- end Input fields -->

</body>
</html>

以下函数是通过单击 index.html 中的链接并显示您在上面看到的页面来发出的,然后应该更改其内容:从 index.html 我从链接发出函数:

<a onclick="postEditing()"> Edit</a>

这一行发出以下函数:

function postEditing()
{
var result = window.open('PostEditor.html', 'newwindow', 'width=350,' + 'height=350');
result.document.getElementById("para1").innerHTML = "11111111111";
result.document.getElementById("para1").innerText = "11111111111";
result.document.getElementById("para1").value = "11111111111";
}

如您所见,我尝试了三种方法。我永远不明白它们之间有什么区别,但我尝试了所有这三种方法,但都没有用!

最佳答案

这是因为您搜索的是显示index.html 的窗口的文档,而不是新打开的窗口的文档。尝试以下操作:

    ...
var editorWindow = window.open('PostEditor.html', 'newwindow', 'width=350,' + 'height=350');
editorWindow.document.getElementById("para1").innerHTML = "11111111111";
...

编辑:现在我看到了问题:在您试图访问参数 element 的属性的函数中,但您没有为其传递值。所以这将以错误结束,因为访问的对象是 undefinded !

所以你有三个选项来让它工作:

  1. 测试参数(总是一个好主意):var ID = null; if(element) ID = element.id;
  2. 传递一个值:<a onclick="postEditing(this)"> Edit</a>
  3. 删除行 var ID = element.id;

解决方案:(已测试)
我真的说不出为什么,但是 index.html找到了 para1并可以成功设置新文本。但不知何故,新窗口将再次重新初始化旧值。

因此,您必须在运行于 onLoad 的处理程序中进行更改:

index.html:

<html>
<head>
<script>
function postEditing() {
var result = window.open('PostEditor.html', 'newwindow', 'width=350,' + 'height=350');
result.onload = function() {
result.document.getElementById("para1").innerHTML = "11111111111";
}
}
</script>
</head>
<body>
<a onclick="postEditing()"> Edit</a>
</body>
</html>

PostEditor.html:

 <!DOCTYPE html>
<html>
<head>
<title>Editor</title>
<link href="styles/editor.css" rel="stylesheet" type="text/css" media="screen" />
<script src="scripts/mainScript.js"> </script>
</head>
<body>
<!-- Input fields -->
<div class="center">
<form id=caller method="post">
<p id="para1" class="text"><Strong>Post your message</Strong></p>
<textarea id="textEditor" rows="16" cols="34" name="content"></textarea>
<input type="submit" onclick="urlLoader('caller','posthandler.php')" value="Post">
</form>
</div>
<!-- end Input fields -->

</body>
</html>

关于javascript - 更改元素文本不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17450611/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com