javascript - 基于函数调用的不同结果

时间:2017-01-27 20:14:23

标签: javascript jquery html twitter-bootstrap

我正在尝试确定引导容器的左边距量,包括页面加载和浏览器大小调整。

JS:

$(function() {
    var margin = parseInt($('.container').first().css('margin-left'), 10);
});

$(window).resize(function () {
    var margin = parseInt($('.container').first().css('margin-left'), 10);
});

HTML:

<div class="container">
    <div class="row">
        <div class="col-sm-9 main">
            <div class="content text-center">
                <h1>MAIN CONTENT</h1>
            </div>
        </div>

        <div class="col-sm-3 sidebar">
            <div class="content text-center">
                <h1>SIDEBAR</h1>
            </div>
        </div>
    </div>
</div>

我的问题是当它在页面加载时运行时,边距值比窗口大小调整大约10px。

示例:我加载页面并且margin变量的计算结果为233.当我调整大小时,它会立即求值为225,无论是哪个指示我正在调整大小。在两种情况下执行javascript时都知道原因是什么?

1 个答案:

答案 0 :(得分:1)

我认为这是因为你的第一个电话等待加载页面而第二个电话被直接评估。

看一下这个例子:http://codepen.io/anon/pen/GrOWoZ?editors=0011

使用jQuery包装函数时,如$( function(){ /* code */ } )

JQuery等待文档准备好。 https://api.jquery.com/ready/ $(function() { // Handler for .ready() called. });

直接绑定事件时,它不会等待文档准备就绪。

我希望这有帮助!