Question

我尝试了很多方法让页面标题每3秒自动更新一次，这样标题就可以显示他们有多少条未读消息。

以下是我的尝试：

setInterval(function() {
        document.title = "<?php echo $inboxcc; ?>";
    }, 3000);

和

$(function() {
setInterval(function() {
     $(this).attr("title", "<?php echo $inboxcc; ?>");
    }, 3000);
});

但它们都不起作用。

Answer 1

每次需要新数据时都需要从服务器刷新数据，因为PHP块每页面视图只执行一次（在服务器上）。制作一个这样的PHP页面：

<?php
  // data.php
  // Grab the user from the session and calculate the 'unread messages' value
  $user['inboxcc'] = the_unread_messages_value;
  echo json_encode($user);
?>

然后动态地拉动数字：

var updater = function() {
    $.getJSON('data.php',function(jsonuser){
        document.title = jsonuser.inboxcc;
        setTimeout(updater,3000);
    });
};

setTimeout(updater,3000);

请注意，我使用的是setTimeout而不是setInterval，因为您无法确定每个请求是否会在3秒后返回。一般来说，使用setTimeout会更好。

Answer 2

这种方法不起作用。您的PHP语句将在服务器端执行一次，因此无论您在JavaScript中执行什么操作，标题都不会更改多次。

您需要一种基于AJAX的方法，该方法将成功设置document.title属性：

$.ajax({
  url: 'new_page_title.php',
  data: {name: 'username', password: 'userpass'},
  success: function(data) { document.title = data;},
  dataType: 'text'
});

现在：虽然您当然可以将此代码塞进setInterval电话中，但我建议每隔3秒检查一次可能会对您的服务器造成一点困难，而且没有必要。每隔15-60秒就会更温和。

setInterval(function() {
    $.ajax({
        ...
    });
}, 30000); // milliseconds

Answer 3

为了补充@ mblase75的答案（这是正确的），这是对你陷入的常见误解的进一步解释。

PHP是服务器端预处理器，它输出发送到您的浏览器的HTML和Javascript，然后与任何事情无关。

所以，你的PHP：

<?php $inboxcc = 'Title'; ?>
<script type="text/javascript">
setInterval(function() {
    document.title = "<?php echo $inboxcc; ?>";
}, 3000);
</script>

产生输出：

<script type="text/javascript">
setInterval(function() {
    document.title = "Title";
}, 3000);
</script>

这是您的浏览器所看到的。就是这样。

Answer 4

JavaScript中的PHP块无法为自己更新信息。您需要使用AJAX，隐藏的iframe或其他方式更新标题。此时，您的代码会将<title>元素更改为相同的值。

Answer 5

您的PHP代码无法在javascript中解释，因此请隐藏隐藏输入中的值：

<input type="hidden" id="inboxcc" value="<?php echo $inboxcc; ?>">

现在您可以在javascript中调用该值：

setInterval(function() {
        document.title = document.getElementById('inboxcc').value;
    }, 3000);

自动刷新文档标题？

5 个答案: