【问题标题】:html: stop page refresh when entering a valuehtml:输入值时停止页面刷新
【发布时间】:2013-05-21 08:30:24
【问题描述】:

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

第一列显示从网络服务器提取的数据,第二列允许更改值,然后将新值提交到网络服务器。 我还有另一个表,它从需要每 20 秒刷新一次的 Web 服务器中提取实时数据。 目前,我每 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 中的一个值。 [[]]里面的值是需要刷新的值,输入值是用来改变值的。抱歉,如果这太模糊了。感谢您的帮助,但出于保密原因不能发布太多代码。

【问题讨论】:

  • 请贴一些代码。
  • 你是如何刷新页面的——如果它使用了settimeout,你可以使用输入的cleartimeout onkeyup

标签: javascript html forms


【解决方案1】:

您可以使用 AJAX 每隔 20 秒下载一次数据,而不是刷新整个页面,这样您就不需要刷新整个页面,因此您的输入不会丢失 :)

【讨论】:

    【解决方案2】:

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

    【讨论】:

      【解决方案3】:

      setInterval 是否调用了您的刷新?

      如果是真的,只需做类似的事情:

      var interval;
      
      interval = setInterval(refreshPage(), 20000);
      
      $("input").keypress(function(){
          clearInterval(interval);
      });
      

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

      【讨论】:

      • 我正在使用简单的 来刷新
      • 那么如果你想添加“可编程性”你没有选择,你必须用javascript来做......(为了与刷新交互)
      • 好的,谢谢。您提供的示例代码会按原样工作还是我需要添加另一个函数来重新启动间隔?
      • 要添加间隔,您需要添加另一个时间interval = setInterval(refreshPage(), 20000);
      猜你喜欢
      • 2015-10-21
      • 1970-01-01
      • 2019-04-17
      • 2012-05-22
      • 1970-01-01
      • 1970-01-01
      • 2015-08-10
      • 2015-11-14
      相关资源
      最近更新 更多