我想创建一个有按钮的网站，当你点击它时，它会改变一些文字（说明为真/假）。当用户单击按钮时，文本必须更改，但不仅仅是针对一个用户，对于网站上的每个用户。
我尝试这样做的方式是我有一个文本文件，到目前为止我所有的都是页面上的一些文本，每500毫秒刷新一次以显示文本文件中的内容。
所以现在我需要做的就是在单击按钮时更新文本文件。我能做到这一点的最好方法是什么？ （我希望能够按下托管该站点的计算机上的按钮或访问该站点的另一台计算机。）
谢谢， Fjpackard。
更新
的index.php：
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<body>
<div id="theDiv"></div>
</body>
<script>
$("document").ready(function(){
$("button").remove();
setInterval(function(){
$("#theDiv").load("file.txt");
},500);
var deviceAgent = navigator.userAgent.toLowerCase();
var agentID = deviceAgent.match(/(iphone|ipod|ipad)/);
if (agentID) {
// mobile code here
}
else {
$("body").prepend("<button>Toggle</button>");
$("#theDiv").css("visibility","none");
$("button").click(function(){
myClick();
});
}
});
function myClick() {
var url = ''; //put the url for the php
value = $.post("", {}).done(
function(data) {
$('#theDiv').html(data);
}
);
}
</script>
的script.php：
<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST')
{
$file = 'file.txt';
$previous = file_get_contents($file);
if ($previous === 'true')
{
file_put_contents($file, 'false');
echo 'false'; //this is what we return to the client
}
else
{
file_put_contents($file, 'true');
echo 'true'; //this is what we return to the client
}
exit();
}
?>
答案 0 :(得分：1)
单击该按钮可以使用jQuery或简单的javascript创建一个Ajax请求。这将更新该文本文件。
如何在jQuery中创建Ajax请求： http://api.jquery.com/jquery.ajax
Iinjoy
答案 1 :(得分：0)
您将在服务器上读取名为“file.txt”的文件。
假设您有这段代码每500毫秒刷新一次页面：
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
function myClick()
{
//somehow get and change the value
/*var value = ???*/
$('#theDiv').html(value ? 'true' : 'false');
}
$("document").ready(
function()
{
setInterval(
function()
{
$("#theDiv").load("file.txt");
},
500
);
}
);
</script>
<div id="theDiv"></div>
<input type="button" value="click me" onclick="myClick()">
所以现在我需要做的就是在单击按钮时更新文本文件。我能做到这一点的最好方法是什么？ （我希望能够按下托管该站点的计算机上的按钮或访问该站点的另一台计算机。）
的script.php：
<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST')
{
$file = 'file.txt';
$previous = file_get_contents($file);
if ($previous === 'true')
{
file_put_contents($file, 'false');
}
else
{
file_put_contents($file, 'true');
}
exit();
}
?>
这是更新文件的服务器端代码。
的index.php
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
function myClick()
{
var url = 'script.php'; //put the url for the php
$.post(url, {}); //avoiding using "done", let the timer update instead
}
$("document").ready(
function()
{
setInterval(
function()
{
$("#theDiv").load("file.txt");
},
500
);
}
);
</script>
<div id="theDiv"></div>
<input type="button" value="click me" onclick="myClick()">
在这里，我们正在制作一个ajax请求，以便从按钮的事件处理程序中执行该代码。
注意：代码$.post(url, {})将发出请求。在这种情况下，我们不使用done延续（将在服务器发送其响应时执行）以避免使用计时器的竞争条件。
到目前为止，您一直在阅读file.txt。您可以利用script.php来提供当前值。这将在GET请求而不是POST中完成。
的script.php：
<?php
// disable cache by HTTP
header("Expires: Thu, 01 Jan 1970 00:00:00 GMT");
header('Cache-Control: max-age=0, no-cache, no-store, must-revalidate');
// disable cache by IE cache extensions
header('Cache-Control: post-check=0, pre-check=0', false);
// disable cache by Proxies
header("Pragma: no-cache");
$file = 'file.txt';
if ($_SERVER['REQUEST_METHOD'] === 'POST')
{
// POST request
$previous = file_get_contents($file);
if ($previous === 'true')
{
file_put_contents($file, 'false');
}
else
{
file_put_contents($file, 'true');
}
}
else
{
// not POST request, we assume it's GET
echo file_get_contents($file);
}
exit();
?>
的index.php：
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
function myClick()
{
var url = 'script.php'; //put the url for the php
$.post(url, {});
}
$("document").ready(
function()
{
setInterval(
function()
{
$("#theDiv").load('script.php');
},
500
);
}
);
</script>
<div id="theDiv"></div>
<input type="button" value="click me" onclick="myClick()">
如您所见，我们现在使用script.php来读取和写入。这便于在服务器上进行检查。例如：可能不允许所有用户更新值或检索它。
注意：保护程序存在竞争条件。如果两个客户端“在同一时间”在服务器上发出请求，则它们对文件的更新将重叠，结果看起来只发生一次更新（而不是两次）。
<强>观察：
{}）。还要考虑：