Question

PHP

$urls = Array('www.1.com.br','www.2.com.br', 'www.3.com.br');

HTML

<iframe src="www.1.com.br" width='100%' height='100%'></iframe>

<button>Next</button>

如何点击下一个按钮，只更新URL数组序列中的iframe网址（不更新整页）？

我也怀疑在php或javascript中使用所有网址的数组是否更好

更新

<script>
    jQuery('#someFrame').submit(function(){             
           $.ajax({
            url: 'updateUrl.php',
            type: '???',
            data: ????,
        });     
    })



var currentIndex = 0;
var urls = ['www.1.com.br','www.2.com.br', 'www.3.com.br'];
document.getElementById('someButton').addEventListener('click', function () {
    currentIndex = Math.min(currentIndex + 1, urls.length - 1);
    document.getElementById('someFrame').setAttribute('src', urls[currentIndex]);
});
</script>

<iframe src="www.1.com.br" width='100%' height='100%' id="someFrame"></iframe>
<button id="someButton">Next</button>

什么需要页面updateUrl.php，刷新页面而不刷新？

Answer 1

这不能完全用PHP完成，你需要JS来使它工作。 PHP由Web服务器解释，因此当它到达浏览器时，浏览器不知道该PHP。所以它在你想要它的意义上真的是互动的。

另一方面，JavaScript非常适合这种交互 - 无刷新行为。

类似

HTML

<iframe src="www.1.com.br" width='100%' height='100%' id="someFrame"></iframe>
<button id="someButton">Next</button>

的Javascript

var currentIndex = 0;
var urls = ['www.1.com.br','www.2.com.br', 'www.3.com.br'];
document.getElementById('someButton').addEventListener('click', function () {
    currentIndex = Math.min(currentIndex + 1, urls.length - 1);
    document.getElementById('someFrame').setAttribute('src', urls[currentIndex]);
});

Answer 2

添加到iframe data-current-url="1"和data-url1，.... data-urlN 按下接下来只检查当前和是否有属性： data-url(current+1)使用该属性中的值并更新data-current-url="(current +1)"

如果没有此类属性，请将data-current-url重置为1并从data-url1获取网址。我们将通过这个解决方案进行循环

数组网址 - 回显下一个网址

2 个答案: