Question

我有一个以html格式创建的表。

第一列显示从Web服务器提取的数据，第二列允许更改值，然后将新值提交给Web服务器。我还有另一个表从Web服务器提取实时数据，需要每20秒刷新一次。目前，我每隔20秒刷新整个页面。

问题是当页面刷新时，如果您已开始在表格单元格中键入值，则刷新后该值将丢失。我已经尝试了一些JavaScript来保留cookie中的值，这到目前为止一直有效。但我想知道如果在表格单元格的输入框中选择了光标，是否有办法简单地停止刷新。

<form id=form1 name=f1 method=post action=/scripts/write-tags autocomplete=on>
        <input type=hidden name=tag1 value=9>
        <input type=hidden name=tag2 value=61>
        <input type=hidden name=tag3 value=44>
        <input type=hidden name=tag4 value=25>
        <input type=hidden name=back value=/savetest.htm>
        <input type=hidden name=page value=1>       
    <table id=data border="1" cellpadding="10" width="700" style="font-family:Arial; font-size:15px";>
    <th>Operation</th><th>Value</th><th>New Value</th>
        <tr>
            <td width="400">Enter the Value of the desired motor RPM</td> 
            <td width="100">[[130]]</td>
            <td width="100"><input type=text size=3 name=data1 value="[[9]]"></td>
        </tr>
        <tr>
            <td width="400">Enter the Value of the Target FOP in feet (TVD)</td> 
            <td width="100">[[61]]</td>
            <td width="100"><input type=text size=3 name=data2 value="[[61]]"></td>
        </tr>
        <tr>
            <td width="400">Enter the Value of the Shutdown Delay in minutes</td> 
            <td width="100">[[256]]</td>
            <td width="100"><input type=text size=3 name=data3 value="[[44]]"></td>
        </tr>
        <tr>
            <td width="400">Enter the Value of the Flow Rate Delay in seconds</td> 
            <td width="100">[[24]]</td>
            <td width="100"><input type=text size=3 name=data4 value="[[25]]"></td>
        </tr>
        <tr>
            <td width="700"><input style="font-family:Arial; font-size:15px;"type=submit name=submit value=&nbsp;OK&nbsp;></td>
        </tr>
    </table>    
</form>

我已经更新了一些示例代码。 Web服务器内置于PLC中。标签和数据名称是指PLC中的值。 [[]]中的值是需要刷新的值，输入值用于更改值。如果这太模糊，请道歉。我很感激帮助，但由于保密原因无法发布太多代码。

Answer 1

您可以使用AJAX以20秒的间隔下载数据，而不是刷新整个页面，然后您不需要刷新整个页面，因此您的输入不会丢失：）

Answer 2

尝试在用户输入后每次将计时器重置为20 如果您添加代码，我可以提供更多帮助...

Answer 3

是由setInterval调用的刷新？

如果这是真的，那就干这样做：

var interval;

interval = setInterval(refreshPage(), 20000);

$("input").keypress(function(){
    clearInterval(interval);
});

然后在值更改时重新启动间隔

html：输入值时停止页面刷新

3 个答案: