Question

我正试图让我的cms网站将页面ID附加到我的静态URL中，并使用javascript或可能的ajax在页面ID中循环浏览。

如果您点击“展示广告3”，则现在的网址为http://local.CMSTest.com/showDisplay.php?display=3 这是我期望从上一页的链接获得的。

我正在尝试更改我一直在使用的数组以严格使用json，并且我想使用JavaScript来设置网址，并在一段时间后将页面刷新到下一个网址。

下面是我当前数组的每个返回结果的json打印结果，为两页。

因此，在这种情况下，我想在页面加载时 1.将第一个对象的pageID附加到看起来像http://local.CMSTest.com/showDisplay.php?display=3&pageID=104的URL上 2.使用第一个JSON对象的其他元素（panel_type_id，content等）填写html 3.使用json的持续时间（以秒为单位）以设置间隔 4.时间到了，刷新页面，现在循环添加下一个pageID http://local.CMSTest.com/showDisplay.php?display=3&pageID=116，依此类推。

当前的javascript在控制台中显示我期望成为下一个URL的内容，但是我希望它会将第一个array / json结果的pageID附加到当前的活动URL中，而并非如此，它只是显示了?diplay=3。所以我觉得这是对的，但是我在某处缺少了东西

这是JSON结构：

{pageID: "104", page_type_id: "1", display_id: "3", slide_order: null, duration: "54", …}
active:"1"
background_img:"images/BG_spring.svg"
contID:"165"
cont_id:"165"
content:"<!DOCTYPE html>↵<html>↵<head>↵</head>↵<body>↵<p>This is the first page</p>↵</body>↵</html>"
display_id:"3"
duration:"54"
pageID:"104"
page_id:"104"
page_type_id:"1"
panel_id:"114"
panel_type_id:"1"

{pageID: "116", page_type_id: "1", display_id: "3", slide_order: null, duration: "54", …}
active:"1"
background_img:"images/BG_spring.svg"
contID:"166"
cont_id:"166"
content:"<!DOCTYPE html>↵<html>↵<head>↵</head>↵<body>↵<p>This is the second page</p>↵</body>↵</html>"
display_id:"3"
duration:"54"
pageID:"116"
page_id:"116"
page_type_id:"1"
panel_id:"113"
panel_type_id:"1"

当前的HTML

<?php foreach($showDisplayResult as $showDisplays): ?>
    <?php if($showDisplays['page_type_id'] == 1){ ?>

        <?php //print_r($showDisplays);?>
        <div class="row top">
            <?php include 'banner.php'?>
        </div>

        <div class="row middle" style="background-image: url(<?php echo $showDisplays['background_img']?>);">
            <div class="col-lg-12">
                <?if($showDisplays['panel_type_id'] == 1){?>
                <div class="fullContent" style="/*background-color: rgba(255, 255, 255, 0.5);*/ height: 100%; ">
                <?php echo $showDisplays['content']?>
                </div>
                <?}?>
            </div>
        </div>

        <div class="row bottom">
            <?php include 'ticker.php';?>
        </div>

    <?php }?> 
<?php endforeach?>

和javascript：

<script type="text/javascript">
function setDisplay() {
  let params = new URL(document.location).searchParams;
  let pageID = params.get("pageID");
  let disply = params.get("display");
  // set the html based on pageID and display
}

function getNextURL() {
  // encode your php array to json
  let obj = <?php echo json_encode($showDisplays); ?>;

  let params = new URL(document.location).searchParams;
  params.set("pageID", obj.pageID);
  params.set("display", obj.display_id);

  let url = window.location.href.split('?')[0];
  let nextURL = url + "?" + params.toString();
  console.log(nextURL);
  console.log(obj);
  return nextURL
}

getNextURL();
</script>

Answer 1

如果要注销正确的值（看起来应该是正确的值），那么您所缺少的就是更改窗口的实际URL：

window.location.href = getNextUrl();

请记住，您尚未实现延迟，因此当前可以不间断地刷新到下一页。

更新以回答评论问题：

要仅在obj.duration之后才能更新url，可以对getNextURL函数执行以下操作：

// encode your php array to json
let obj = <?php echo json_encode($showDisplays); ?>;

let params = new URL(document.location).searchParams;
params.set("pageID", obj.pageID);
params.set("display", obj.display_id);

let url = window.location.href.split('?')[0];
let nextURL = url + "?" + params.toString();
window.setTimeout(function () {
    window.location.href = nextURL;
}, obj.duration * 1000);

在上面的代码中，我假设您的持续时间以秒为单位，但是window.setTimeout的工作毫秒数是* 1000。

这是在创建下一个URL之后执行的操作，它将等待obj.duration秒，然后才将下一个URL分配为当前URL。

通过将json值附加到URL来循环页面URL，并按间隔刷新

1 个答案: