如何添加按钮以更改网址

时间:2015-05-24 17:31:15

标签: php html json html5

我有一个从JSON生成的php页面,但我无法找到一种方法来使按钮转到其他页面。 目前我必须在URL中定义页面并每次手动更改它。 我的URL中还有其他值,我不想删除。 我该怎么做呢。 我目前尝试过:

  • Zebra_Pagination
  • onassar / PHP-分页 但他们需要一个我不使用的SQL数据库

这是我现有的代码,我已经出于设计原因添加了按钮。

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Blackout Media Partner Search tool</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">

<!-- Custom styles for this template -->
<link href="/css/jumbotron-narrow.css" rel="stylesheet">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>


</head>
<body>
<div class="container">

<?php
/**
 * Created by PhpStorm.
 * User: Marcel
 * Date: 5/23/2015
 * Time: 7:04 PM
 */

 $keyword = $_GET['keyword']; 
 $page = $_GET['page'];
 if($page == 0) {
     $start = 1;
 } else {
    $start = $page * 10;
 }
 echo '<center><h2>Blackout Media channel search tool</h2></center>';
 echo '<nav>
  <ul class="pager">
    <li class="previous"><a href="#"><span aria-hidden="true">&larr;</span> Previous Page</a></li>
    <li class="disabled"><a href="#">Page ' . $page . '</a></li>
    <li class="disabled"><a href="#">Start ' . $start . '</a></li>
    <li class="disabled"><a href="#">Keyword ' . $keyword . '</a></li>
    <li class="next"><a href="#">Next Page <span aria-hidden="true">&rarr;</span></a></li>
  </ul>
</nav>';
    echo'<div class="panel panel-primary">';
    echo '<div class="panel-heading"><h3 class="panel-title">Search</h3></div>';
    echo '<div class="panel-body">';
    echo '<div class="row">
    <div class="col-lg-4">
    <div class="input-group"><center>
        <form action="/" method="GET">
      <input type="text" class="form-control" placeholder="Search for..." name="keyword">
      <span class="input-group-btn">
  <input class="btn btn-default" type="submit" value="Search" />
</form></center>
</div>
</div>
</div>
</div>
</div>
<br>
<br>';
function AddDecimals($number, $dec_point='.', $thousands_sep=','){
    if($dec_point==$thousands_sep){
        trigger_error('2 parameters for ' . __METHOD__ . '() have the same value, that is "' . $dec_point . '" for $dec_point and $thousands_sep', E_USER_WARNING);
        // It corresponds "PHP Warning:  Wrong parameter count for number_format()", which occurs when you use $dec_point without $thousands_sep to number_format().
    }
    if(preg_match('{\.\d+}', $number, $matches)===1){
        $decimals = strlen($matches[0]) - 1;
    } else {
        $decimals = 0;
    }
    return number_format($number, $decimals, $dec_point, $thousands_sep);
}

$jsonContents = file_get_contents('https://gdata.youtube.com/feeds/api/channels/?q='.$keyword.'&start-index='.$start.'&v=2&&max-results=10&alt=json');

$json = json_decode($jsonContents, true);
//var_dump($json);
foreach($json['feed']['entry'] as $feed) {
    echo '<br>';
    echo'<div class="panel panel-primary">';
    echo '<div class="panel-heading"><h3 class="panel-title"> Channel: '. $feed['title']['$t'] . '</h3></div>';
    echo '<div class="panel-body">';
    echo '<ul class="nav nav-tabs nav-justified">
  <li role="presentation"><a target="_blank" href="'. $feed['link'][1]['href'].'">Youtube</a></li>
  <li role="presentation"><a target="_blank" href="https://channelmeter.com/search/?q='. $feed['yt$channelId']['$t'] .'">ChannelMeter</a></li>
  <li role="presentation"><a target="_blank" href="http://vidooly.com/search/'. $feed['yt$channelId']['$t'] .'">Vidooly</a></li>
  <li role="presentation" class="disabled"><a href="#">SocialBlade</a></li>
</ul>';
    echo '<ul class="list-group">';
    echo '<li class="list-group-item">Channel Name: '. $feed['title']['$t'] . '</li>';
    echo '<li class="list-group-item">Channel Description: '. $feed['summary']['$t'] . '</li>';
    echo '<li class="list-group-item">Channel ID: '. $feed['yt$channelId']['$t'] . '</li>';
    echo '<li class="list-group-item">Subscribers: '. AddDecimals($feed['yt$channelStatistics']['subscriberCount']) . '</li>';
    echo '<li class="list-group-item">Views: '. AddDecimals($feed['yt$channelStatistics']['viewCount']) . '</li>';
    echo '<li class="list-group-item">Channel Link: <a href='. $feed['link'][1]['href'].'>'. $feed['link'][1]['href'].'</a>' .'</li>';
    echo '<li class="list-group-item">Last Update: '. $feed['updated']['$t'] . '</li>';
    echo '<li class="list-group-item disabled">User ID: '. $feed['author']['yt$userId']['$t'] . '</li>';
        echo '<li class="list-group-item disabled">Partner Status: '. $feed['author']['yt$userId']['$t'] . '</li>';
    echo '</ul>';
    echo '</div>';
    echo ' </div>';
    echo '<br>';
}
 echo '<nav>
  <ul class="pager">
    <li class="previous"><a href="#"><span aria-hidden="true">&larr;</span> Previous Page</a></li>
        <li class="disabled"><a href="#">Page ' . $page . '</a></li>
    <li class="next"><a href="#">Next Page <span aria-hidden="true">&rarr;</span></a></li>
  </ul>
</nav>';
echo '</div>';

1 个答案:

答案 0 :(得分:1)

使用jquery在按钮单击中调用一个函数,然后

parent.location.hash = "hello";

你可以拥有这个

<button id="trigger">Change url</button>

当上面的按钮触发时,它将调用以下脚本

<script>
$(document).ready(function(){
$("#trigger").click(function(){
parent.location.hash = "hello";
});
});
</script>

它会在不重新加载页面或手动输入的情况下更改您的网址。

您可以在网址中添加任何内容,例如#value或您的子域名或任何您想要的内容。