用于隐藏 html 列的 Javascript 语法

Question

我正在查看切换显示和隐藏表格列的代码。

我假设这会创建一个数组:

var States = { };

为什么不需要 new operator ？

这一行是否将 States col 元素的 .isOpen 属性设置为 true？

States[col] = {isOpen : true}; 

我正在研究如何修改此函数，以便我可以使用 cookie 保存此列的状态。即 - 当页面呈现时，列默认设置为无。但是，如果最后一个操作是显示列并且页面重新呈现，我希望该列仍然打开，而不是返回到默认值。

代码:

/**************************************************************************
 *
 * Function:    toggleVis
 *
 * Description: Following Function hides and expands the main column.
 *              
 *
***************************************************************************/
// Set the default "show" mode to that specified by W3C DOM
// compliant browsers

  var showMode = 'table-cell';


// However, IE5 at least does not render table cells correctly
// using the style 'table-cell', but does when the style 'block'
// is used, so handle this

  if (document.all) showMode='block';

// This is the function that actually does the manipulation

var States = { };

function toggleVis(col){

    if (!States[col] || States[col].IsOpen == null)
    {
        States[col] = {isOpen : true}; // This assumes the cell is already shown
        //States[col] = {isOpen : false}; // This assumes the cell is already hidden
    } 

    //mode =  States[col].IsOpen ? showMode : 'none';
    mode =  States[col].IsOpen ? 'none' : showMode; //starts from closed, next click need open

    cells = document.getElementsByName(col);
    for(j = 0; j < cells.length; j++) cells[j].style.display = mode;

    States[col].IsOpen = !States[col].IsOpen;
}

Answer 1

var States = {}

这会创建一个新对象 - 数组和对象在 JavaScript 中非常相似，但存在一些细微的差异。

States[col] = {isOpen : true} 

创建一个新对象并将其放入States对象的下一个索引中。例如，您现在可以使用 States.col1.isOpen 访问此值。

我注意到您有两种不同的输入方式:IsOpen 和 isOpen，这可能会给您带来问题。

接下来，您必须使用您想要的信息设置 cookie - 看一下这个 URL: http://www.w3schools.com/JS/js_cookies.asp

希望这有帮助!