如何使用搜索" search / tweets.json"向网站呈现推文?从返回的对象?

时间:2015-11-20 08:23:54

标签: javascript php css json twitter

我使用的是Php,JavaScript,HTML和CSS。这足以让我的代码得到帮助。

HTML:

<body>
    <div class="container">
        <div class="row">
            <div class="col-md-3"></div>
            <div class="col-md-6">
                <h1>Search Social</h1>
            </div>
            <div class="col-md-3"></div>
        </div>
        <div class="row">
            <div class="col-md-3"></div>
            <div class="col-md-6">
                <div class="input-group">
                    <div class="input-group-btn search-panel">
                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                           <span id="search_concept">Filter By</span> <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu">
                          <!--<li><a href="#LinkedIn">LinkedIn</a></li>-->
                          <li><a href="#Twitter">Twitter</a></li>
                          <!--<li><a href="#Instagram">Instagram</a></li>-->
                          <!--<li><a href="#Pinterest">Pinterest</a></li>-->
                          <!--<li><a href="#Facebook">Facebook</a></li>-->
                          <li class="divider"></li>
                          <li><a href="#All">All</a></li>
                        </ul>
                    </div>
                    <input type="hidden" name="search_param" value="all" id="search_param">         
                    <input type="text" class="form-control" name="x" placeholder="Search term..." id="searchedTerm" >
                    <span class="input-group-btn">
                        <button class="btn btn-default" type="button"><span class="glyphicon glyphicon-search" onclick="Tweet()"></span></button>
                    </span>
                </div>
            </div>
            <div class="col-md-3"></div>
        </div>
        <div class="row">
            <br>
            <div class="tweets-container">

            </div>
        </div>
    </div>

    <!------------------------------Scripts------------------------------------------------------------------->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/tweet.js"></script>
    <script src="js/searchbar.js"></script>

</body>

JavaScript的:

function Tweet(){
//Gets inputted text into quotes and places inputted text into searchItem variable for later use
var searchedTerm = '%22' + document.getElementById("searchedTerm").value + '%22';
var hashSearchedTerm = 'OR%23' + document.getElementById("searchedTerm").value;

//var searchedTerm = "%22" + document.getElementById("searchedTerm").value + "%22";
//var hashSearchedTerm = "OR%23" + document.getElementById("searchedTerm").value;
alert(searchedTerm);
alert(hashSearchedTerm);

$.ajax({
    url: 'php/get_tweets.php',
    type: 'GET',
    data: { searchedTerm : searchedTerm, hashSearchedTerm : hashSearchedTerm},
    success: function(response){
        if(typeof response.errors === 'undefined' || response.errors.length< 1)
            {
                console.log(response);
                var $tweets = $('<ul></ul>');
                $.each(response.statuses, function(i, obj){
                    $tweets.append('<li>' + obj.text +' ' + '@' + obj.user.screen_name + '</li>');
                });
                $('.tweets-container').html($tweets);
            }
        else{
            $('.tweets-container p:first').text('Response error');
        }
    },
    error: function(errors){
        $('.tweets-container p:first').text('Request error');
           console.log("successerr");
    }
});

<?php
require_once('twitter_proxy.php');

$oauth_access_token =            "xxxxx";
$oauth_access_token_secret =    "xxxxx";
$consumer_key =                 "xxxxx";
$consumer_secret =              "xxxxx";

$search = '?q=';

if(isset($_GET['searchedTerm']))
{
     $searchedTerm = $_GET['searchedTerm'];
}

if(isset($_GET['hashSearchedTerm']))
{
     $hashSearchedTerm = $_GET['hashSearchedTerm'];
}

$resultType = '&result_type=popular';
$count = '&count=10';

$twitter_url = 'search/tweets.json'; 
$twitter_url .= $search; 
$twitter_url .= $searchedTerm;
$twitter_url .= $hashSearchedTerm;
$twitter_url .= $resultType;
$twitter_url .= $count;


//$getfield= $search + $searchItem + $hashSearchItem + $resultType + $count;

$twitter_proxy = new TwitterProxy(
    $oauth_access_token,
    $oauth_access_token_secret,
    $consumer_key,
    $consumer_secret,
    $search,
    $searchedTerm,
    $hashSearchedTerm,
    $resultType,
    $count
);

    $tweets = $twitter_proxy -> get($twitter_url);

    echo $tweets;?>

这应该是足够的代码来获得帮助。我试图根据搜索的术语呈现十个最受欢迎的最热门推文。我收到的回复显示在我的网站上,但现在我希望它们的格式如下: enter image description here 谢谢你的帮助!

0 个答案:

没有答案