如何在javascript中刷新变量的内容

How to refresh the contents of the variables in javascript

本文关键字：变量 刷新 javascript      更新时间：2023-09-26

我有一个代码，它有各种字段。。。

<div id="tabs-5" data-content-theme="b" data-theme="b" class="ui-body ui-body-b ui-corner-all">
  <form id="fileEn">
    <div data-role="fieldcontain">
      <label for="files">Upload Image Files</label>
      <input id="files" type="file" data-clear-btn="true" value="" multiple/>
      <div id="progress_bar">
        <div class="percent">0%</div>
      </div>
      <output id="result1"></output>
      <output id="result2"></output>
      <output id="result3"></output>
      <output id="result4"></output>
    </div>
    <div data-role="fieldcontain">
      <label for="pwdF">Enter Password:</label>
      <input type="password" name="pwdF" id="val4" value="" />
    </div>
    <div data-role="fieldcontain">
      <label for="bitsF" class="select">Choose bits:
      </label>
      <select name="bitsF" id="val5">
        <option value="128">128</option>
        <option value="192">192</option>
        <option value="256">256</option>
      </select>
    </div>
    <input type="button" id="btn" onclick="load1();return false;" value="Compute" data-theme="b" data-inline="true" />
    <input type="reset" value="Reset" data-theme="b" data-inline="true" />
  </form>
</div>

点击一个名为"Compute"的按钮，就会调用load1（）函数。。。这个load1（）函数执行一些计算并保存计算后的文件。。例如：file1.doc…接下来我按下"重置"按钮以获取空字段。。。现在，当我再次按下"计算"按钮时，当前计算的文件（例如：file2.doc）以及以前的计算文件（file1.doc）将被保存。。这是因为以前的内容没有被删除。。

有人能建议我如何执行类似于Ctrl+F5的操作，点击一个合适的按钮（最好是重置按钮本身，它会调用不同的函数来刷新）来刷新内容吗。。以便只保存当前计算的文件（file2.doc），而不保存所有以前的文件（file1.doc）…

当表单执行重置操作时，您可以使用：执行一些操作

var fileEn = document.getElementById("fileEn"); // Get the form identifier.
fileEn.addEventListener("reset", function() { // When the form performs the reset action.
   reset(); // Call the reset function.
});

类似这样的东西：

(function() {
  window.onload = function() {
    function load1() {
      alert("The compute button has been pressed.");
    }
    function reset() {
      alert("The reset button has been pressed.");
      var files = document.getElementById("files");
      files.value = ""; // To reset the input file field.
    }
    var btn = document.getElementById("btn");
    btn.addEventListener("click", function() {
      load1();
    });
    var fileEn = document.getElementById("fileEn"); // Get the form identifier.
    fileEn.addEventListener("reset", function() { // When the form performs the reset action.
      reset(); // Call the reset function.
    });
  };
})();
<div id="tabs-5" data-content-theme="b" data-theme="b" class="ui-body ui-body-b ui-corner-all">
  <form id="fileEn">
    <div data-role="fieldcontain">
      <label for="files">Upload Image Files</label>
      <input id="files" type="file" data-clear-btn="true" value="" multiple/>
      <div id="progress_bar">
        <div class="percent">0%</div>
      </div>
      <output id="result1"></output>
      <output id="result2"></output>
      <output id="result3"></output>
      <output id="result4"></output>
    </div>
    <div data-role="fieldcontain">
      <label for="pwdF">Enter Password:</label>
      <input type="password" name="pwdF" id="val4" value="" />
    </div>
    <div data-role="fieldcontain">
      <label for="bitsF" class="select">Choose bits:
      </label>
      <select name="bitsF" id="val5">
        <option value="128">128</option>
        <option value="192">192</option>
        <option value="256">256</option>
      </select>
    </div>
    <input type="button" id="btn" value="Compute" data-theme="b" data-inline="true" />
    <input type="reset" value="Reset" data-theme="b" data-inline="true" />
  </form>
</div>

相关文章：