个人中心
gpt4 book ai didi

javascript - 如何从外部 jQuery 文件调用 HTML 文档中的函数

转载 作者：行者123 更新时间：2023-12-02 23:06:41 25 4
gpt4 key购买 nike

我需要有关在外部 js (jQuery) 文件中的函数运行后运行 html 文档中的函数的逻辑和方法的帮助。

我有两个外部 jQuery 文件。两者都创建表，但 timesheet_test.js 的作用远不止于此。 timesheet_my_table_test.js(创建表 1)和 timesheet_test.js(创建表 2)。

表 1 中的单元格在单击时会运行 html 文档中的函数。

例如

.append('<td class="earlyshift" onclick="setShift(this.className)"></td>')

功能:

function setShift(className) {
  // Gets the workday shift from the localStorage.
  const targetStateValue = localStorage.getItem('shiftstatus');

  // The logic for updating the value.
  if (targetStateValue === null) {
    localStorage.setItem('shiftstatus', className);
  } else {
    localStorage.setItem('shiftstatus', className);
  }
}

timesheet_test.js 然后在单击表格标题(在表 2 中)时运行一个函数，该函数的操作取决于上次单击上面表 1 中的哪个单元格。

例如

鼠标按下:

if (targetStateValue === "earlyshift") {
  var startCell = [0,curColHead.data("col")];
  isColSelecting = true;
  startSelecting(ev,startCell);
}

鼠标悬停:

if (targetStateValue === "earlyshift") {
  var endCell = [14,curColHead.data("col")];
  var correctedCells = cellCompare(operationArea.startCell,endCell);
  afterSelecting(ev,correctedCells);                        
}

此函数的最终结果是它更改了表 2 中所选列中单元格 0 到单元格 14 的背景颜色(当前在 css 中设置)。

然后我想运行另一个函数，即 html 文档中的函数(无需添加任何更多按钮来单击)。我目前必须单击一个按钮才能运行它，并且想要取消该按钮(已经需要单击 2 到 3 次表才能完成该过程)。我希望它在上面的 Mouseup 事件之后执行:

该功能远未完成，但可以按原样运行。完成后，它将更改启动此过程的相应单元格中的图标/图像(当前在 css 中设置):

$("#J_timingSubmit2").click(function(ev){

  var sheetStates = sheet.getSheetStates();
  var rowsCount = 15;
  var colsCount = 7; //currently not used but want to use it in testData.match below.
  var timesheetrowsdata = "";
  var timesheetcoldata = "";

  for(var row= 0, rowStates=[]; row<rowsCount; ++row){
    rowStates = sheetStates[row];
    timesheetrowsdata += rowStates+(row==rowsCount-1?'':',');
  }

  timesheetcoldata = timesheetrowsdata.replace(/,/g, '');

  const testData = timesheetcoldata;
  const dataArr = testData.match(/.{1,7}/g)
  .map(s => Number(s[0]))

  let dataSum = dataArr.reduce((a, b) => a + b);

  let isSameAsRowsCount = dataSum == rowsCount;

});

这是工作按钮代码(成功运行上面的函数):

<button class="J_sheetControl" id="J_timingSubmit2">Submit</button>

如何翻译该按钮代码，以便可以从其他 js 文件运行该函数？

最佳答案

我会重构你的代码，以便你有一个“库”javascript 文件。然后将该文件包含在两个页面上。

编辑:这模拟了我试图解释的那种事情。每个<script>虽然标记将是单独的文件，但其工作方式相同。

如果“库 js 文件”仅包含函数，则可以将其放在页面上的任何位置，因为 JavaScript 会缓存所有函数和类内容并允许您在任何地方使用它，但是，如果您在然后确保将库文件放在实际的 javascript 之上。

如果您的代码之后仍然无法工作，那么您的代码可能有问题

<html>
    <head>
        <script type="text/javascript">
            //library file
            var test = "hello world!";
        </script>
        <script type="text/javascript">
            //code
            console.log(test);
        </script>
    </head>
    <body>

    </body>
</html>

关于javascript - 如何从外部 jQuery 文件调用 HTML 文档中的函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57558549/

25 4 0
文章推荐： PowerShell 1 不使用 tee 捕获批处理文件输出
文章推荐： elasticsearch - 创建索引- Elasticsearch -Java API
文章推荐： javascript - 如何在对象数组中动态添加 id 属性？
文章推荐： javascript - 在 jquery 中单击选项卡时禁用单击？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com