Javascript 用JS刷新页面的一部分_Javascript_Jquery_Ajax_Html

Javascript 用JS刷新页面的一部分

javascript jquery ajax html

Javascript 用JS刷新页面的一部分,javascript,jquery,ajax,html,Javascript,Jquery,Ajax,Html,我无法使用Jquery更新标签。它应该在我的页面上每秒钟更新一次，但什么也没发生。我的javascript有什么问题吗基本上我想做的是每秒钟更新一次标签。但不知怎么的，这是行不通的。谁能帮帮我吗下面是我的2个文件的代码： //////////////Index.html：/////////////////  <!DOCTYPE HTML PUBLIC "-//W3

我无法使用Jquery更新标签。它应该在我的页面上每秒钟更新一次，但什么也没发生。我的javascript有什么问题吗

基本上我想做的是每秒钟更新一次标签。但不知怎么的，这是行不通的。谁能帮帮我吗

下面是我的2个文件的代码：

//////////////Index.html：/////////////////

<!--AWP_IN_Variable Name='"webdata".AmountOfErrors' -->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
   <title>Gebr. Gerrits Recycling Helmond</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <link href="css/default.css" rel="stylesheet" type="text/css"/>

   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="http://code.highcharts.com/highcharts.js"></script>
   <script src="/js/jquery.min.js"></script>
   <script src="/js/highcharts.js"></script>
</head>
<body>
    <div class="Maindiv">
        <div class="header">
           <img src="images/gerritslogo800.jpg" class="Logo">   
        </div>

        <div class="content">
        <br/>
        <table>
        <tr>
            <th>Part</th>
            <th>Value</th>
        </tr>
        <tr>
            <td>Ferro:</td>
            <td>0 kg</td>
        </tr>   
        <tr>
            <td>Non-Ferro:</td>
            <td>0 kg</td>
        </tr>
        <tr>
            <td>Errors:</td>
            <td><label id="amountOfErrors" name="amountOfErrors">:="webdata".AmountOfErrors:</label></td>
        </tr>
        </table>
        </div>  
<script type="text/javascript">
    $(document).ready(function()
    {
        //query the amountOfErrors variable every second
        $.ajaxSetup({ cache: false });
        setInterval(function() 
        {
            $.get("IOamountOfErrors.htm", function(result)
            {
                $('#amountOfErrors').text(result);
            });
        },1000);
    });
</script>
       <div class="footer">
           Gebr. Gerrits Metaalhandel Helmond B.V. <br/>
           Gebr. Gerrits Metaalrecycling B.V. <br/>
           Auto Verschrotings Industrie "A.V.I." Den Bosch B.V. <br/>
           Euregio Recycling B.V.<br/>      
       </div>
    </div>
</body>
</html>


Gebr。杰里茨·赫尔蒙


部分
价值
费罗：
0公斤
非铁：
0公斤
错误：
：=“webdata”。数量：
$（文档）.ready（函数（）
{
//每秒查询一次Amounters变量
$.ajaxSetup（{cache:false}）；
setInterval（函数（）
{
$.get（“ioamountferrors.htm”，函数（结果）
{
$（'#amountferors'）。文本（结果）；
});
},1000);
});
Gebr。Gerrits Metaalhandel Helmond B.V.

Gebr。Gerrits Metaalrecycling B.V.

汽车行业“A.V.I.”登博世B.V.

Euregio回收有限公司

//////////////ioamountferrors.htm：/////////////////

<!--AWP_IN_Variable Name='"webdata".AmountOfErrors' -->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
   <title>Gebr. Gerrits Recycling Helmond</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <link href="css/default.css" rel="stylesheet" type="text/css"/>

   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="http://code.highcharts.com/highcharts.js"></script>
   <script src="/js/jquery.min.js"></script>
   <script src="/js/highcharts.js"></script>
</head>
<body>
    <div class="Maindiv">
        <div class="header">
           <img src="images/gerritslogo800.jpg" class="Logo">   
        </div>

        <div class="content">
        <br/>
        <table>
        <tr>
            <th>Part</th>
            <th>Value</th>
        </tr>
        <tr>
            <td>Ferro:</td>
            <td>0 kg</td>
        </tr>   
        <tr>
            <td>Non-Ferro:</td>
            <td>0 kg</td>
        </tr>
        <tr>
            <td>Errors:</td>
            <td><label id="amountOfErrors" name="amountOfErrors">:="webdata".AmountOfErrors:</label></td>
        </tr>
        </table>
        </div>  
<script type="text/javascript">
    $(document).ready(function()
    {
        //query the amountOfErrors variable every second
        $.ajaxSetup({ cache: false });
        setInterval(function() 
        {
            $.get("IOamountOfErrors.htm", function(result)
            {
                $('#amountOfErrors').text(result);
            });
        },1000);
    });
</script>
       <div class="footer">
           Gebr. Gerrits Metaalhandel Helmond B.V. <br/>
           Gebr. Gerrits Metaalrecycling B.V. <br/>
           Auto Verschrotings Industrie "A.V.I." Den Bosch B.V. <br/>
           Euregio Recycling B.V.<br/>      
       </div>
    </div>
</body>
</html>

<！--AWP_IN_变量名='“webdata”.amounters'--> ：=“webdata”。数量：

（在“之间添加了空格，我的最佳选择是您正在调试本地而不是在Web服务器上，对吗

因为您的javascript正在尝试执行跨源请求，而该请求在文件上不起作用：//

编辑：

你能试试这个密码吗

<script type="text/javascript">
    $(document).ready(function()
    {
        //query the amountOfErrors variable every second
        setInterval(function() 
        {
            $.post("IOamountOfErrors.htm", function(result)
            {
                $('#amountOfErrors').text(result);
            });
        },1000);
    });
</script>


$（文档）.ready（函数（）
{
//每秒查询一次Amounters变量
setInterval（函数（）
{
$.post（“ioamountferrors.htm”），函数（结果）
{
$（'#amountferors'）。文本（结果）；
});
},1000);
});

要更新标签，可以使用setInterval。下面是一些可能有用的代码

var count = 20;
function myFunction() {
    setInterval(function(){  startCounter() }, 1000);
}
$("#counterStart").click(function(e){
    myFunction();
});
 function startCounter() {
    $("#counter").text(count);
 }

HTML:


DFSDF

工作正常

我无法在本地环境中读取变量，因为它是PLC（可编程逻辑控制器）webserver。我只需要更新我页面的这一部分。当我按下f5按钮时，变量会发生变化，但这不是我想要的…@Bart你确定你复制了所有内容吗？javascript的问题是你使用的get将cachign设置为false。Ajax只会在url末尾添加字符，但错误是它无法完成d由于这些字符而导致的URL。您应该删除ajaxSetup，而不是发出get请求，您应该执行post reuqest，因为这些字符没有缓存。我复制了您的部分并将其放置在我的脚本上。仍然不起作用。我可以看到@owain已经添加了检查$.post（“IOAmoFerrountors.htm”，函数（result）有点不对劲