1

これは私の最初の投稿です。私はプログラマーではありません。私が取り組んでいるプロジェクトのために、ときどき Web 中のコードをまとめているだけです。

作業中の Web サイトにスクロール Twitter マーキーを実装しようとしていますが、「Uncaught Reference Error: Jquery not defined」エラーが発生します。

これは、Jquery が正しくインクルードされていないか、インクルードが失敗したためだと思いました。私は次のことを試しました：

  1. さまざまな URL から Jquery を含め、ローカルでホストする
  2. Jquery が最初に来るように my の include ステートメントの順序を変更する

SO で同様のスレッドをいくつか見つけましたが、どれもこれを解決するのに役立ちません。

これが私のコードです：

<head>
<meta charset="UTF-8" />
<title>UnBox 2013 : Venues</title>
<link rel="stylesheet" type="text/css" media="all" href="/Volumes/Boot/Users/siddharthnair/Dropbox/UnBox 2013 Build/resonate/style.css" />
<link href='http://fonts.googleapis.com/css?family=Lekton:400,400italic,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,600,400italic,700' rel='stylesheet' type='text/css'>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'/> 
<script src='/Volumes/Boot/Users/siddharthnair/Dropbox/UnBox 2013 Build/resonate/jquery.marquee.js'/> 


<script type='text/javascript'>

var Tweetstream = {
init: function () {
this.insertLatestTweets('unboxfestival');
}, 
insertLatestTweets: function (username) {
 var limit = 5; // How many feeds do you want?
 var url = 'https://api.twitter.com/1/statuses/user_timeline.json?screen_name=' + username + '&count=' + limit + '&callback=?'; 

 $.getJSON(url, function (data) {
  var html = '<marquee behavior="scroll" scrollamount="1" direction="left">';

  for (var i in data) {
   html += '<a href="http://twitter.com/' + username + '#status_' + data[i].id_str + '">' + data[i].text + ' <i>' + Twitter.daysAgo(data[i].created_at) + '</i></a>';
  }

  html += '</marquee>';

  $('.tweetstream p').replaceWith(html);

  Twitter.fancyMarquee();
 });
}, 

fancyMarquee: function () {
 $('.tweetstream marquee').marquee('pointer')
  .mouseover(function () {
   $(this).trigger('stop');
  })
  .mouseout(function () {
   $(this).trigger('start');
  })
  .mousemove(function (event) {
   if ($(this).data('drag') == true) {
    this.scrollLeft = $(this).data('scrollX') + ($(this).data('x') - event.clientX);
   }
  })
  .mousedown(function (event) {
   $(this).data('drag', true).data('x', event.clientX).data('scrollX', this.scrollLeft);
  })
  .mouseup(function () {
   $(this).data('drag', false);
  });
}, 

daysAgo: function (date) {
 // TODO: Fix date for IE...
 if ($.browser.msie) {
  return '1 day ago';
 }

 var d = new Date(date).getTime();
 var n = new Date().getTime();

 var numDays = Math.round(Math.abs(n - d) / (1000 * 60 * 60 * 24));
 var daysAgo = numDays + ' days ago';

 if (numDays == 0) {
  daysAgo = 'today';
 }
 else if (numDays == 1) {
  daysAgo = numDays + ' day ago';
 }

 return daysAgo;
}
};

Tweetstream.init();
</script>
</head>

これがスパムでないことを願っています。質問に答えていると思われるスレッドがここにある場合は、お気軽に正しい方向に向けてください。

コードのほとんどはここから来ています: http://andreaslagerkvist.com/archives/2011/06/24/how-to-create-a-scrolling-twitter-feed-using-jquery/

4

2 に答える 2

0

最初にjqueryスクリプトタグを追加すると、jqueryコードはdocument.readyである必要があります

<head>
<meta charset="UTF-8" />
<title>UnBox 2013 : Venues</title>
<link rel="stylesheet" type="text/css" media="all" href="/Volumes/Boot/Users/siddharthnair/Dropbox/UnBox 2013 Build/resonate/style.css" />
<link href='http://fonts.googleapis.com/css?family=Lekton:400,400italic,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,600,400italic,700' rel='stylesheet' type='text/css'>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'/> 
<script src='/Volumes/Boot/Users/siddharthnair/Dropbox/UnBox 2013 Build/resonate/jquery.marquee.js'/> 


<script type='text/javascript'>
$(document).ready(function() {
var Tweetstream = {
init: function () {
this.insertLatestTweets('unboxfestival');
}, 
insertLatestTweets: function (username) {
 var limit = 5; // How many feeds do you want?
 var url = 'https://api.twitter.com/1/statuses/user_timeline.json?screen_name=' + username + '&count=' + limit + '&callback=?'; 

 $.getJSON(url, function (data) {
  var html = '<marquee behavior="scroll" scrollamount="1" direction="left">';

  for (var i in data) {
   html += '<a href="http://twitter.com/' + username + '#status_' + data[i].id_str + '">' + data[i].text + ' <i>' + Twitter.daysAgo(data[i].created_at) + '</i></a>';
  }

  html += '</marquee>';

  $('.tweetstream p').replaceWith(html);

  Twitter.fancyMarquee();
 });
}, 

fancyMarquee: function () {
 $('.tweetstream marquee').marquee('pointer')
  .mouseover(function () {
   $(this).trigger('stop');
  })
  .mouseout(function () {
   $(this).trigger('start');
  })
  .mousemove(function (event) {
   if ($(this).data('drag') == true) {
    this.scrollLeft = $(this).data('scrollX') + ($(this).data('x') - event.clientX);
   }
  })
  .mousedown(function (event) {
   $(this).data('drag', true).data('x', event.clientX).data('scrollX', this.scrollLeft);
  })
  .mouseup(function () {
   $(this).data('drag', false);
  });
}, 

daysAgo: function (date) {
 // TODO: Fix date for IE...
 if ($.browser.msie) {
  return '1 day ago';
 }

 var d = new Date(date).getTime();
 var n = new Date().getTime();

 var numDays = Math.round(Math.abs(n - d) / (1000 * 60 * 60 * 24));
 var daysAgo = numDays + ' days ago';

 if (numDays == 0) {
  daysAgo = 'today';
 }
 else if (numDays == 1) {
  daysAgo = numDays + ' day ago';
 }

 return daysAgo;
}
};
}
Tweetstream.init();
</script>
</head>
于 2012-12-10T13:20:39.157 に答える
0

type="text/javascript" を jQuery 参照タグに追加します -

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type="text/javascript">

さらに、URL の末尾にある単一引用符を移動するか、スラッシュを削除する必要があります。

次に、コードをドキュメント対応ラッパーで囲みます -

$(document).ready(function() {
    // your code here
});
于 2012-12-10T13:35:14.843 に答える