1

I have two pages, both with similar structures - tables with id tags like the following

<TABLE id="assetsTable1" width="100%" class="tableWrapDataClass"> ...

and

<table id="vocationalRevenueTable" class="revenue" width="100%"> ...

Both pages are using nearly identical javascript code. But the value of a global variable behaves differently on Page 2!

Here's a snippet of Page 1;

<script type="text/javascript" src="templates/footer.js"></script>
<script type="text/javascript" src="script/jquery-1.8.1.js"></script>
<script type="text/javascript" src="script/scripts.js"></script>
<script>
                $(document).ready(function() {
                    var assetsTable1 = $('#assetsTable1');
                    var assetsTable2 = $('#assetsTable2');
                    var liabilitiesTable1 = $('#liabilitiesTable1');
                    var liabilitiesTable2 = $('#liabilitiesTable2');
                    var shareholderTable = $('#shareholderTable');

                    // note not all subtotals are shown
                    $("#A2Row1").hide();
                    $("#A2Row2").hide();
                    $("#L2Row1").hide();
                    $("#L2Row2").hide();
                    console.log(window.assetsTable1);
                });
                // etc

and from Page 2,

<script type="text/javascript" src="templates/footer.js"></script>
<script type="text/javascript" src="script/jquery-1.8.1.js"></script>
<script type="text/javascript" src="script/scripts.js"></script>
<script>
                $(document).ready(function() {
                    var vocRevTableRef = $('#vocationalRevenueTable');
                    var nonVocRevTableRef = $('#nonVocationalRevenueTable');
                    var otherRevTableRef = $('#otherRevenueTable');

                    // note not all subtotals are shown initially
                    $("#vocationalRevenueTableSub").hide();
                    $("#nonVocationalRevenueTableSub").hide();
                    $("#otherRevenueTableSub").hide();
                    console.log(window.vocRevTableRef);
                });
                // etc

In Firebug, that console.log() call on Page 1 quite reasonable displays

<table id="assetsTable1" class="tableWrapDataClass" width="100%">

On page 2, however, it returns

undefined

But if I amend the console.log() calls on both pages to remove the 'window.' bit, eg;

console.log(assetsTable1);

and

console.log(vocRevTableRef);

Things return to sanity. In both cases, Firebug displays the Object

Object[table#vocRevTableRef.tableWrapDataClass]

and

Object[table#assetsTable1.tableWrapDataClass]

Something is going on with the window object. Of course this is utterly maddening. What could I possibly be missing? What should I be looking for to debug this? (The HTML doesn't appear to be malformed.) I'm simply trying to pass the object reference in question into a function that pulls rows out of thePassedReference.tbodies and sums them, but of course it fails on Page 2 since it's mysteriously passing an undefined value. Halp! Thanks.

4

3 回答 3

0

这两个变量都不是全局变量，第一个示例有效，因为浏览器允许通过其 ID a'la 访问元素window.IdOfAnElement（示例 1 中元素的 id 等于变量名）。

注意：console.log显示 DOMNode 的标记，当它显示变量的内容时，结果将是 jQuery 对象，而不是 DOMNode

于 2014-01-13T17:04:32.630 回答
0

var vocRevTableRef不是全局变量 - 删除'var'它会变成一个。当然，您的其他所谓的全局变量也是如此。第二个示例中的 Console.log 不起作用，因为隐藏元素$("#vocationalRevenueTableSub").hide();变得无法访问。

于 2014-01-13T17:05:09.193 回答
0

在第一页上，您可以访问window.assetsTable1，因为您有一个带有 . 的元素。id="assetsTable1"这不是因为您的变量（它被声明为 var，所以不是全局的）

在第二页上，没有带有 name 的元素，id="vocRevTableRef"也没有带有 name 的全局变量vocRevTableRef。因此它给出了undefined.

于 2014-01-13T17:09:24.847 回答