Question

我在我的页面上运行此脚本，通过更改其“left”css属性将div部分移出屏幕。如果页面请求包含查询字符串，则会在页面加载时发生：

     function pageLoad() {

        var isQueryRequest = isQueryPostback(); // check for query string

        if(isQueryRequest)
        {
            document.getElementById("container").style.left = -340;  // not working

            document.getElementById("selectorText").innerHTML = "<< Show Query View";
            document.getElementById("querySelector").onclick = slideOut;
        }
        else
        {
            document.getElementById("selectorText").innerHTML = "<< Hide Query View";
            document.getElementById("querySelector").onclick = slideIn;
        }
    }


    <div id="container" style="position:relative; left:30px;" >
       // contains other divs
    </div>

我已确认执行进入第一个if块，但该行未在Firefox或Chrome中执行。它确实在IE中执行良好。在查看firebug时，页面上没有明显的错误。

不知道它是否相关但在.aspx页面中运行。

编辑 - 下面的slideIn（）和slideOut（）：

  function slideOut() {

    var slidingDiv = document.getElementById("container");

    var stopPosition = 30;

    if (parseInt(slidingDiv.style.left) < stopPosition) {
        slidingDiv.style.left = parseInt(slidingDiv.style.left) + 28 + "px";
        setTimeout(slideOut, 1);
    }

    document.getElementById("selectorText").innerHTML = "<< Hide Query View";
    document.getElementById("querySelector").onclick = slideIn;  
  }

  function slideIn() {

    var slidingDiv = document.getElementById("container");
    var stopPosition = -340;

    if (parseInt(slidingDiv.style.left) > stopPosition) {
        slidingDiv.style.left = parseInt(slidingDiv.style.left) - 28 + "px";
        setTimeout(slideIn, 1);
    }

    document.getElementById("selectorText").innerHTML = "<< Show Query View";
    document.getElementById("querySelector").onclick = slideOut; 
  }

Answer 1

这可能会给你带来问题：

.innerHTML = "<< Show Query View";

逃避那些不太好的标志，因为它们可能会呈现为HTML，这会搞砸你的布局：

.innerHTML = "&lt;&lt; Show Query View";

Answer 2

将值放在双引号中，例如：

{
....
.......style.left="300px";
....
}

使用Javascript在firefox / chrome中无法更改相对div的左侧位置

2 个答案: