使用 Javascript 在 IE6 中“对所选单元格求和”

2024-06-28

在 Excel 中,可以突出显示一系列单元格并在“状态栏”中查看“总和”。

这可以在 IE6 中使用 Javascript 和 HTML 表格来完成吗?


这里有一些代码可以帮助您开始使用 jQuery。当然,有很多方法可以改进它。

(EDIT:需要检查的一件事是它在 IE 中的运行情况如何。我认为你需要添加类似的东西this.onselectstart = function() {return false}; in the mousedown事件处理程序来禁用 IE 中的文本选择,但我目前没有方便使用 IE。)

<html>
<head>
<style type="text/css">
    .sel {background-color: #99ff33; }
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script>
$(function () {
    function col(cell) {
        return cell.parent().children("td").index(cell);
    }

    var start = null;

    function selectTo(cell) {
        if (start == null)
            return;
        $("td").removeClass("sel");
        var stop = $(cell);
        var tbl = start.closest("table");
        var rs = tbl.children("tbody").children("tr");
        var r0 = rs.index(start.parent()), c0 = col(start);
        var r1 = rs.index(stop.parent()), c1 = col(stop);
        var sum = 0;
        for (var i = r0; i <= r1; i++) {
            var cells = $(rs.get(i)).children("td");
            for (var j = c0; j <= c1; j++) {
                var cell = $(cells.get(j));
                cell.addClass("sel");
                sum += Number(cell.html());
            }
        }
        $("#total").html(""+sum);
    }

    $("table").mousedown(function () {
        return false;
    });

    $("td").mousedown(function () {
        start = $(this);
        selectTo(this);
        return false;
    });

    $("td").mouseover(function () {
        selectTo(this);
    });

    $("td").mouseup(function () {
        selectTo(this);
        start = null;
    });

    $("body").mouseup(function () {
        start = null;
    });
});
</script>

<body>
  <table>
    <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> </tr>
    <tr> <td>2</td> <td>4</td> <td>6</td> <td>8</td> </tr>
    <tr> <td>3</td> <td>6</td> <td>9</td> <td>12</td> </tr>
  </table>
  <p>Total of selected elements: <span id="total"></span></p>
</body>

</html>

演示在这里。 http://jsbin.com/ihiyu

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Javascript 在 IE6 中“对所选单元格求和” 的相关文章

  • 如何告诉 Sonar 使用我的可靠报告来获取单元测试结果

    我们有一个 Jenkins 作业 其中包含一堆 javascript 文件 我们通过 grunt 构建项目 并在构建结束时运行 JSCover 来运行单元测试并收集代码覆盖率 这一切都有效 我们得到了一个不错的 LCOV 文件 并且在 ta
  • EXT JS中有全局变量吗

    在 java 和 C 中 我们可以全局存储变量并从项目中的任何位置访问它的值 比如说 我在一个名为Residence我正在保存residenceNumber这是一个INT到一个名为的全局变量houseNumberGlobalVariable
  • 是否可以隐藏 HTML 文本区域元素上的滚动条?

    是否可以使用 CSS 或任何其他方式隐藏 HTML 文本区域元素上的滚动条 style overflow hidden 但不确定你为什么要这样做
  • 将 Babel 与单个输出文件和 ES6 模块一起使用

    这是我的 gulp 任务 将 ES6 代码编译成单个 ES5 文件 我使用类和模块 import export 在 ES6 中 gulp src paths scripts pipe sourcemaps init pipe babel p
  • 停止倒数计时器 Javascript onClick

    给出以下代码 myButton02 click function myButton02 hide counter animate width toggle var count 65 var counter setInterval timer
  • JSON 解析错误 - JSON 中位置 1 处出现意外标记 o

    我需要获取一个 JSON 对象并记录标题控制台以实现自动完成功能 我的 json 的示例如下 title Example 1 url http www example1 com title Example 2 url http www ex
  • Puppeteer 登录 Instagram

    我正在尝试使用 Puppeteer 登录 Instagram 但不知何故无法登录 你能帮助我吗 这是我正在使用的链接 https www instagram com accounts login https www instagram co
  • 为什么这个 fs.readFile 循环没有将其结果推送到我的数组? [复制]

    这个问题在这里已经有答案了 usr bin env node var fs require fs async require async program require commander program version 0 0 1 usa
  • Angularjs 使用 ng-init 为 ng-model 赋值

    您好 我有以下问题 看起来很简单并且应该有效 但事实并非如此 在我的代码中我输入了
  • 按周将对象数组拆分为组

    我有一个包含这样的数据的对象数组 date 01 01 2017 00 00 00 dataField1 dataField2 date 01 02 2017 00 00 00 dataField1 dataField2 date 01 1
  • 如何获取div背景图像上的锚标记?

    HTML div a href http www facebook com au a div css facey float left width 32px height 32px background url file C Users U
  • 纯 JavaScript 工具提示

    我正在尝试用纯 JavaScript 制作一个工具提示 显示在hover 就像 Stack Overflow 中将鼠标悬停在个人资料名称 a 上一样div显示 我尝试使用onmouseover onmouseout并添加了setTimeou
  • up() 和 down() 与 Ext.getCmp()

    我很困惑我需要在 up down 和 Ext getCmp ID 之间使用哪一个作为 grep 对象 对我来说 定义对象的 ID 并通过 Ext getCmp ID 检索对象更容易 而且代码看起来更干净 例如 console log thi
  • ag-Grid 中的行格式

    我们需要有条件地将行文本设置为粗体 目前它仅适用于单个单元格 但我们需要在所有列单元格上应用文本粗体 应用格式设置后 isBold 列必须隐藏 删除 此列仅用于格式化 如何应用文本缩进 10px isBold 列包含真实值的第一列的 有可能
  • 在移动 Safari 上自动播放音频

    在我被火烧死之前 我知道这目前不起作用 因为苹果担心自动下载音频文件 然而 我的问题是 有人找到了狡猾的解决方法吗 我只想在游戏启动时播放启动声音 目前必须等待用户单击某处才能播放音频 你们中的一个聪明人现在一定已经成功了吗 没有机会在移动
  • 使用 HTML 标签作为背景图像而不是 CSS background-image 属性?

    我需要使用 html img 标签作为背景图像 div 然后我将放置一个 p 的内容 我已经尝试过 但似乎无法让它们正确显示 我使用了相对位置 负值的边距 任何建议或指出我正确的方向将不胜感激 p div img src http www
  • React Native:当您的应用程序关闭时是否有回调函数?

    我有一个 setInterval 即使您关闭 而不是退出 应用程序也会继续运行 我想在我的应用程序关闭或设备进入睡眠状态时调用一个函数 以便清除 setInterval AppState 是你的朋友 看看AppState 的文档 https
  • 离子选择:预选值在单击一次之前是不可见的

    我刚刚在 ionic 版本 6 中创建了一个 ion select 我的问题是 我在页面加载时已成功预选了一个值 但此预选值未显示在 UI 中 它只是在我单击选择之后出现 但在它没有出现之前 如图 2 所示 我在 ionViewWillEn
  • JQuery 循环遍历动态元素并获取数据值

    我正在尝试使用可折叠面板来完成我的要求 sport on click function var thisId this attr id var thisChildren this sportlist thisChildren each fu
  • 如何使相对div居中?

    我一直在尝试让以下代码工作几个小时 但没有成功 您能帮我将项目 div 居中吗 即使页面放大和缩小时 这是我的 HTML 和 CSS bottom position absolute top 100 left 0 right 0 backg

随机推荐