Question

使用https://startbootstrap.com/template-overviews/portfolio-item/上提供的bootstrap模板，我试图通过点击较小的模板更改图形来源。这是我尝试过没有成功的事情。（先谢谢！）

在主图上添加了id =“myImage”

<img class="img-responsive" id="myImage" src="img1.jpg">

较小

上的

和onClick =“changeImage（）”

<div class="col-sm-3 col-xs-6">
    <a href="#" onClick="changeImage()">
        <img class="img-responsive portfolio-item" src="img2.jpg">
    </a>
</div>

脚本功能是：

<script type="text/javascript">
    function changeImage() {
        if(document.getElementById('myImage').src == 'img1.jpg') {
            document.getElementById('myImage').src = 'img2.jpg';
        } else if(document.getElementById('myImage').src == 'img2.jpg') {
            document.getElementById('myImage').src = 'img1.jpg';
        }
    }
</script>

（提前致谢！）

Answer 1

getElementBYId（'onlyIDnoDot'）应该是语法。

<script type="text/javascript">
    function changeImage() {
        if(document.getElementById('myImage').src == 'http://placehold.it/750x500') {
            document.getElementById('myImage').src = 'http://placehold.it/500x300';
        } else if(document.getElementById('myImage').src == 'http://placehold.it/500x300') {
            document.getElementById('myImage').src = 'http://placehold.it/750x500';
        }
    }
</script>

在Bootstrap的Portfolio Item模板上更改图像

1 个答案: