英文:
HTML disappearing after PHP function called
问题
这显示了按钮按下的结果。思路是它从文件中读取并写入，以便不同浏览器中的用户可以看到相同的结果。
最初我在访问DOM时遇到了一些问题，但后来发现，在第一次按钮按下后，我的PHP脚本下面的一切都被清除了，“在按钮点击后，这个区域不会显示”。
简单的解决方法是将DOM元素简单地移动到更高的位置，但是...我想知道...
为什么这个区域会被删除？就好像它被当作PHP一样对待。
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
// 背景循环
function updateChat() {
var file = 'word.txt?v=' + Date.now();
var rawFile = new XMLHttpRequest();
rawFile.open("GET", file, false);
rawFile.onreadystatechange = function () {
if (rawFile.readyState === 4) {
if (rawFile.status === 200 || rawFile.status == 0) {
var allText = rawFile.responseText;
console.log(allText);
document.getElementById("shownword").innerHTML = allText;
}
}
}
rawFile.send(null);
setTimeout(updateChat, 500);
}
<!-- language: lang-html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Random Word Generator</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript"></script>
<script language="javascript" src="update.js" type="text/javascript"></script>
</head>
<body onload="updateChat();">
<p id="shownword"></p>
<form action="" method="post">
<input type="submit" name="word" class="button" value="Button1" id="button1" />
<input type="submit" name="word" class="button" value="Button2" id="button2" />
</form>
<?php
// 当按钮被按下时，将调用此函数
function postword(){
$fp = fopen('word.txt', 'w');
fwrite($fp, $_POST['word']);
fclose($fp);
}
// 当按钮被按下时，将调用函数
if (isset($_POST['word'])) {
postword();
return;
}
?>
This area doesn't get shown after button click
</body>
</html>
<!-- end snippet -->
这是您提供的代码的翻译部分。
英文:
This displays the result of a button press. The idea is that it reads and writes from a file so that users in different browsers can see the same result.
I had some issues accessing the DOM originally but then discovered that after the first button press, everything below my php script is wiped This area doesn't get shown after button click
The easy workaround is to simply move the DOM element higher up but... I want to know...
Why is this area getting deleted? It's as if it's being treated like PHP.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
//Background Loop
function updateChat(){
var file = 'word.txt?v=' + Date.now() ;
var rawFile = new XMLHttpRequest();
rawFile.open("GET", file, false);
rawFile.onreadystatechange = function ()
{
if(rawFile.readyState === 4)
{
if(rawFile.status === 200 || rawFile.status == 0)
{
var allText = rawFile.responseText;
console.log(allText);
document.getElementById("shownword").innerHTML = allText;
}
}
}
rawFile.send(null);
setTimeout(updateChat, 500);
}
<!-- language: lang-html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Random Word Generator</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript"></script>
<script language="javascript" src="update.js" type="text/javascript"></script>
</head>
<body onload="updateChat();">
<p id=shownword></p>
<form action="" method="post">
<input type="submit" name="word"
class="button" value="Button1" id="button1"/>
<input type="submit" name="word"
class="button" value="Button2" id="button2"/>
</form>
<?php
//This function gets called when button is pushed
function postword(){
$fp = fopen('word.txt', 'w');
fwrite($fp, $_POST['word']);
fclose($fp);
}
//When the button is pushed, the function will be called
if (isset($_POST['word'])) {
postword();
return;
}
?>
This area doesn't get shown after button click
</body>
</html>
<!-- end snippet -->
答案1
得分: 1
只删除"return;"。
if(isset($_POST['word'])) {
postword();
// return;
}
英文:
Just remove the "return;"
if(isset($_POST['word'])) {
postword();
// return;
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论