某些 Javascript 函数不适用于 WAMP

我编写了一个 javascript 函数,它根据单击哪个按钮更改元素的背景图像。所有图像都存储在一个单独的文件夹中。它在 localhost 之外正常工作,但是当我在 localhost 上运行该页面时,该特定功能不再有效,所有其他 javascript 功能都正常工作。我还没有在那个页面上实现 php,所以我不确定问题出在哪里。


function changeBG(btnID){

    var card = document.getElementById('edit');

    if(btnID == 'btn1')

        card.style.backgroundImage = "url('/images/1.JPG')";

    else if(btnID == 'btn2')

        card.style.backgroundImage = "url('/images/2.jpg')";

    else if(btnID == 'btn3')

        card.style.backgroundImage = "url('/images/3.jpg')";

    else if(btnID == 'btn4')

        card.style.backgroundImage = "url('/images/4.jpg')";

}

.cardImage{

    height: 15rem;

    width: 30rem;

    border-radius: 30px;

    background: #a4bac0;

    background-image: url('');

    background-position: center;

}

<div class="cardImage" id="edit">

    <h5>Card</h5>

</div>

<div class="options">

    <h6>Options</h6>

    <button class="op" id="btn1" onclick="changeBG(this.id);">1</button>

    <button class="op" id="btn2"  onclick="changeBG(this.id);">2</button>

    <button class="op" id="btn3"  onclick="changeBG(this.id);">3</button>

    <button class="op" id="btn4"  onclick="changeBG(this.id);">4</button>

    <button class="op" id="save">Save</button>

</div>


ABOUTYOU
浏览 368回答 1
1回答

LEATH

我最终弄明白了,出于某种原因,除非您硬刷新页面,否则对 css 的实时更改不会显示在本地主机上!所以我编辑了javascript以在选择一个选项时刷新div。如果有人好奇,请像下面一样。感谢您的建议 :)$("card").load("customize.php");
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript