Question

<script type="text/javascript">
$(document).ready(function () {
  $('#Lines').click(function () {
    $('html').css('background-image', 'url("../Images/banner.jpg")');
  });
});
</script>

<a id="Lines" href="Home.aspx?PostId=<%#Eval("PostId") %>" >Read Post</a>

我正在使用C＃编码。当我点击Read Post链接时，它会转到另一个页面，我在jQuery中设置的背景图像不再可用，它只显示2或3秒。之后它显示默认背景图像。如何使用jQuery设置背景图像permanant。

Answer 1

当您移动到另一个页面时，JavaScript会从“干净的平板”开始，因此您在上一页中所做的任何更改都不会自动进行到下一页。

更改背景图片时，您可以使用localStorage保存设置，然后在下一页再次阅读。

将代码更改为：

$(document).ready(function () {
    $('#Lines').click(function () {
        $('html').css('background-image', 'url("../Images/banner.jpg")');

        // save the background image to localstorage    
        if (localStorage) {
            localStorage.setItem('bg', '../Images/banner.jpg');
        }
    });
});

并将此脚本放在要使用新背景的每个页面上：

$(document).ready(function () {
    if( localStorage && localStorage.getItem('bg') ) {
        $('html').css('background-image', 'url("' + localStorage.getItem('bg') + '")');
    }
});

Demo

如何使用jquery设置背景图像？

1 个答案: