EBook/EBook.Web/EditTable/EditTable.js

var AdjustTableFunc = function () {
    var TriggerFlag = false;  // 触发标志
    var Index = 0;
    $.each($("table"), function (index, item) {
        var TableWidth = isNaN(parseFloat($(item).width())) ? 0 : parseFloat($(item).width());  // 表格宽度
        // 替换HTML
        var ChildHtmlStr = $(item).prop("outerHTML")
        var HtmlStr = "<div class='TableContainer TContain_" + Index + "'></div>";
        $(item).after(HtmlStr);
        $(item).remove();
        var JqStr = ".TContain_" + Index;
        $(JqStr).append(ChildHtmlStr);
        Index += 1;
    });
    var Index = 0;
    $.each($("table"), function (index, item) {
        var TableWidth = isNaN(parseFloat($(item).width())) ? 0 : parseFloat($(item).width());  // 表格宽度
        // 替换HTML
        var JqStr = ".TContain_" + Index;
        var BodyWidth = isNaN(parseFloat($(document).width())) ? 0 : parseFloat($(document).width());  // 界面宽度
        $(JqStr).css("width", BodyWidth + "px");
        if (TableWidth > BodyWidth) {
            // 额外显示滚动条
            var SHtmlStr = "<div class='PSBar' style='width: " + BodyWidth + "px;'></div>";
            $(JqStr).after(SHtmlStr);
            var HiddenRate = BodyWidth / TableWidth;  // 滚动条比率
            var HiddenWidth = BodyWidth - (TableWidth - BodyWidth) * HiddenRate;  // 现滚动条大小
            var CSHtmlStr = "<div class='CSBar' style='width: " + HiddenWidth + "px;'></div>";
            $(JqStr).next().append(CSHtmlStr);
        }
        Index += 1;
    });
    // 滚动条事件
    $(".TableContainer").on("touchstart", function () {
        TriggerFlag = true;
    }).on("touchmove", function () {
        var TableWidth = isNaN(parseFloat($(this).find("table").width())) ? 0 : parseFloat($(this).find("table").width());  // 表格宽度
        var BodyWidth = isNaN(parseFloat($(document).width())) ? 0 : parseFloat($(document).width());  // 界面宽度
        var HiddenRate = BodyWidth / TableWidth;  // 滚动条比率
        var SLeftWdith = isNaN(parseFloat($(this)[0].scrollLeft)) ? 0 : parseFloat($(this)[0].scrollLeft);
        SLeftWdith *= HiddenRate;
        var NextClsName = $(this).next().attr("class");
        if (NextClsName == "PSBar") {
            $(this).next().find(".CSBar").css("left", SLeftWdith + "px");
        }
    });
    window.addEventListener("scroll", function (event) {
        var ClsName = event.target.className;
        if (ClsName == undefined) {
            return;
        }
        ClsName = ClsName.replace("TableContainer ", ".");
        var TableWidth = isNaN(parseFloat($(ClsName).find("table").width())) ? 0 : parseFloat($(ClsName).find("table").width());  // 表格宽度
        var BodyWidth = isNaN(parseFloat($(document).width())) ? 0 : parseFloat($(document).width());  // 界面宽度
        var HiddenRate = BodyWidth / TableWidth;  // 滚动条比率
        var SLeftWdith = isNaN(parseFloat($(ClsName)[0].scrollLeft)) ? 0 : parseFloat($(ClsName)[0].scrollLeft);
        SLeftWdith *= HiddenRate;
        var NextClsName = $(ClsName).next().attr("class");
        if (NextClsName == "PSBar") {
            $(ClsName).next().find(".CSBar").css("left", SLeftWdith + "px");
        }
    }, true);
};