javascript - 为什么我的简单 jQuery 代码不适用于 .css() 方法？

Question

我有以下简单的代码，但似乎不起作用。

jQuery(document).ready(
    function($)
    {
        $(window).resize(
            function()
            {
                setGrid($);
            }
        );

        setGrid($);
    }
);

function setGrid($)
{
    var contactContainer    =   $('#contactInfo');

    if(contactContainer.width() < 650)
    {
        console.log('Too short');
        $('.col_1_2').css(
            {
                width     :   '100% !important',
                margin    :   '0 !important'
            }
        );
    }
    else
    {
        console.log('Too long');

        $('.col_1_2').css(
            {
                width       :   '49% !important',
                marginRight :   '1% !important'
            }
        );

        $('.last').css(
            {
                width       :   '49% !important',
                marginRight :   '0 !important',
                marginLeft  :   '1% !important'
            }
        );
    }
}

因此，根据#containerInfo，当我调整窗口大小时，我在 Chrome 控制台中收到了两条消息，但 .col_1_2 未更新。

是不是我的代码有什么问题而我却找不到？

注意:我打开了我的控制台，但我没有在我的控制台中收到任何错误消息。同样在我的控制台的“元素”选项卡中，我正在检查必须修改的元素，但我没有看到任何变化。通常应在匹配元素上添加“样式”属性。

亲切的问候

Answer 1

尝试取消 !important... 你不需要它们，因为使用 .css 应用的样式会直接添加到元素中(覆盖可能适用的任何其他样式)。