Question

请参阅JSFiddle链接：https://jsfiddle.net/s11oo2gg/。我们不允许在这里使用jQuery和iframe。

现在问题是，如果您先点击电阻并将鼠标悬停在不同的内容图像上，然后点击X标记返回，内容图像将停留在您离开的位置，并且不会正确加载其他内容图像。它会显示一个破碎的图像链接。

每次点击<div id="slider1_contain">（X标记）时，我都只想重新加载<span class="closeButton">，以便相应地加载目标内容图像。

我不想让location.reload();在单击X时解决此问题。我不想重新加载整个页面，只有div。

我看到人们在问同样的问题并用AJAX解决它。这个案例我需要AJAX吗？或者我们可以在以下javascript中做些什么？

提前谢谢!!

<script type="text/javascript"> 
        function showContent(target){
            document.getElementById(target).style.display = 'block';
            document.getElementById("boxThumb").style.display = 'none';
        }

        function hideContent(target){
        document.getElementById(target).style.display = 'none';
        document.getElementById("boxThumb").style.display = 'block'

        }
    </script>

<script type="text/javascript">
    var children = document.querySelectorAll('.toggle > section[id]');
    function showDetailContent(target) {
    // Simply loop over our children and ensure they are hidden:
    for (var i = 0, child; child = children[i]; i++) {
        child.style.display = 'none';
    }
    // Now, show our child we want to show
    document.getElementById(target).style.display = 'block';
    }
    </script>

Answer 1

如果您只想重新加载div，可以使用innerHTML。

 document.getElementById(target).innerHTML = '<img src="image.jpg">';

重新加载div javascript只需ajax吗？

1 个答案: