undefined显示而不是Twitter的用户名

时间:2012-11-11 17:25:30

标签: javascript jquery jquery-mobile

我正在我的jQuery Mobile页面上实现推特推特功能,但我不断显示undefined而不是该人的用户名。

我正在使用Google Chrome。正如答案所示,我编辑了JavaScript代码。

HTML:

<!DOCTYPE html>
<html>
<head> 
  <title>Twitter Search</title> 
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> 
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
  <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
  <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
   <script src="_/js/myscript.js"></script>
  <link rel="stylesheet" href="_/css/mystyles.css" />
</head>
<body>
<div id="home"data-role="page">
    <div data-role="header" data-position="fixed" data-theme="b">
      <h1>Choose your Query</h1>
    </div><!-- /header -->

    <div data-role="content">   
      <ul>
        <li class="main"><a href="#tweetQ" data-transition="flip" data-search="Coventry">Coventry </a></li>
        <li class="main"><a href="#tweetQ" data-transition="flip" data-search="Birmingham">Birmingham</a></li>
    </ul>

    </div><!-- /content --> 
</div><!-- /page -->

<div id="tweetQ" data-role="page" data-add-back-btn="true">
    <div data-role="header" data-position="fixed" data-theme="b">
      <h1>The Tweets</h1>
    </div><!-- /header -->

    <div data-role="content">   
      <ul data-role="listview"  id="searchlist"> 
      <li><a href="#tweet" data-transition="flip">tweet 1</a></li>
      </ul>

    </div><!-- /content -->
</div><!-- second page -->

<div id="tweet" data-role="page" data-add-back-btn="true">
    <div data-role="header" data-position="fixed" data-theme="b">
      <h1>The account</h1>
    </div><!-- /header -->
    <div data-role="content">   
      <p>Yo</p>     
    </div><!-- /content -->
</div><!-- result page -->

</html>
</body>

JavaScript代码:

$('#tweetQ').live('pageshow', loadSearch);

function loadSearch() {
console.log('data');
var search = $('#tweetQ').data('search');
var url = 'http://search.twitter.com/search.json?q='+ search;
console.log('search');
$.ajax({
url: 'http://search.twitter.com/search.json?q='+search,
dataType: "jsonp",
jsonpCallback: "tweetList",
success:
    function(tweetList) { 
                alert("success");
            }
 });
} 
function tweetList(data) {
console.log('data');
$.each(data.results, function(i, result) {
console.log(result.from_user);
console.log(result.text);
var html = '<li><a href="#tweet"><h3>'+result.from_user+ '</h3></a></li>'
$('ul#searchlist').append(html);
$('ul#searchlist').listview('refresh');
$('ul#searchlist').find("a:last").click(function() {
console.log('click');
});
});
}

1 个答案:

答案 0 :(得分:0)

您的问题就在这一行

jsonpCallback: "tweetList"

我相信您在请求完成时尝试调用tweetList函数,在这种情况下,您应该设置成功属性

success: tweetList

所以你的ajax调用看起来应该是

$.ajax({
    url: 'http://search.twitter.com/search.json?q='+search,
    dataType: "jsonp",
    success:tweetList
 });