1

我正在我的 jQuery Mobile 页面上实现一个 twitter 推文功能,但我一直在undefined显示而不是显示此人的用户名。

顺便说一句,我正在使用谷歌浏览器。正如答案所建议的,我已经编辑了 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');
});
});
}
4

1 回答 1

0

你的问题在这条线上

jsonpCallback: "tweetList"

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

success: tweetList

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

$.ajax({
    url: 'http://search.twitter.com/search.json?q='+search,
    dataType: "jsonp",
    success:tweetList
 });
于 2012-11-11T17:37:16.113 回答