Question

当用户点击菜单按钮并导航到不同的网页时，我正在尝试更改我的网站背景图片（正文标记）。

我在_Layout.cshtml中使用jquery并且这样做：

 <body>
<div class="page">
    <header>
        <br />
        <div id="menubutton">
            <a href="@Url.Action("Index", "Kitchen")" id="bg1">
                <img src="../../Content/Layout_images/menu_kitchen.png" alt="kitchen" /></a>
            <a href="@Url.Action("Index", "Stock")" id="bg2" >
                <img src="../../Content/Layout_images/menu_stock.png" alt="stock" /></a> 
            <a href="@Url.Action("Index", "Shop")" id="bg3" >
                    <img src="../../Content/Layout_images/menu_shop.png" alt="shoppinglist" /></a>
        </div>

<script type="text/javascript">

$(function () {
    $('#menubutton a').live('click', function () {

        // Get the background class from id
        var bgclass = $(this).attr('id');
        var temp = "url('Content/Layout_images/bg2.jpg')";

        $('body').css('background-image', temp);
        alert($('body').css('background-image'));
        // Set the clicked menu button color
        var menuclass = bgclass + "_menu";
        $(this).removeClass();
        $(this).addClass(menuclass);
    });
});

然而，虽然当用户点击菜单按钮时背景图像会发生变化，但它会立即改回到css中设置的默认背景图像（注意：尽管我在css中设置了任何背景图像，但它会立即变回空白页面重定向后的背景）

知道为什么会这样吗？如果没有弄错，jquery .css（）假设会改变特定dom的css吗？为什么导航到其他页面后仍会重置？

希望能在这里得到一些帮助......谢谢......

Answer 1

单击该按钮后，您将被重定向到新URL并重新加载布局文件。这意味着在加载新URL时需要一些方法来保存背景图像信息。

@Url.Action("Index", "Kitchen", new { bgImage = 'image url here'} )

然后在布局文件中，编写一个js函数（在 $（document）.ready（function（）{} ）内）将此bgImage参数设置为背景图像。

重定向后由jQuery重置设置的背景图像

1 个答案: