3

私のサイトはWordpressで構築されており、最近、いくつかの基本的なjavascriptを追加しています：RossPW.com

ただし、追加したすべてのJavaScriptが機能していないようで、私の人生の理由がわかりません。

たとえば、次の簡単なスニペットをヘッダーに追加して、-をフェードインしましたが、これは機能しません。

<script type="text/javascript">
$('body').hide();
$('body').fadeIn(3000);
</script>

これまでのところ、これを試してトラブルシューティングするために、私は2つのことを試みました。

1）header.phpにwp_enqueueを適切に追加しました（これは過去にwordpressでいくつかの問題を引き起こすことが知られています：

<?php wp_enqueue_script("jquery"); ?>
<?php wp_head(); ?>

2）ここに外部の.jsファイルとしてjavascriptを含めてみましたが、ヘッダーをアニメーション化するか、一番上までスクロールするための基本的なJSがいくつかあります。これも機能しませんでした。

どんな助けでも大歓迎です-ありがとう！

更新： js/jqueryが正しくロードされるようにするため。私はこの基本的なアラートを試しました-実際には機能します！

<script type="text/javascript">
       alert('ALERT!')
</script>

しかし、私が書いた他のすべてのJavaScriptはそうではなく、その理由を理解することはできません。ここに見られるように、私が書いたjavascriptは問題ないようです：jsfiddle.net/v9NSR/

4

4 に答える 4

3

修正すべき2つのこと-

  • エラー：SyntaxError：不正な文字ソースファイル： http： //rosspw.com/wp-content/themes/rosspw2013/js/rosspw.js行：21、列：5ソースコード：}）;;​</ li>
  • bodyタグを閉じる直前に、このJSコードを追加してみてください。

それがあなたのために働くかどうか私に知らせてください。

Firebugデバッグに使用してみてください。

理解を深めるためにこのスクリーンショットを確認してください-

ロードされる前にjqueryを使用しているため。

jQuery

于 2012-12-27T04:00:10.593 に答える
2

コードで最初に間違っていたのは、$記号を使用してjQueryを呼び出すことでした。WordPressでjQueryをコーディングする場合、WordPressが他のライブラリを使用したり、混乱したりする可能性があるため、コードライブラリとの競合がないことを確認する必要があります。

WordPressでjQueryを使用する適切な方法は、jQuery();代わりに次の$();ようになります。

<script type="text/javascript">
$('body').hide();
$('body').fadeIn(3000);
</script>

これを行う別の方法は、jQueryコードをjQuery$.noConflict()関数でラップすることです。

jQuery.noConflict();
   (function( $ ) {
       $(function() {
          // your code here
       });
   })(jQuery);

noConflict関数の詳細と完全なドキュメントについては、これを確認してください。

それがあなたのために働くことを願っています！

于 2017-01-05T17:46:30.073 に答える
1

jquery.jsをロードしているスクリプトタグの前にjquery関数を呼び出しているようです。

70〜71行目：

$('body').hide();
$('body').fadeIn(3000);

これにより、例外が発生します。Uncaught ReferenceError：$が定義されていません

しかし、jquery.jsは94行目までロードされません。

<script type='text/javascript' src='http://rosspw.com/wp-includes/js/jquery/jquery.js?ver=1.8.3'></script>

次の2つのいずれかを実行できます。

  1. jquery.js参照をページの上部に移動します。

  2. ドキュメントがロードされた後、jquery関数を呼び出します。何かのようなもの：

    関数fadeInBody（）{$（'body'）。hide（）; $（'body'）。fadeIn（3000）; } window.onload=およびfadeInBody;

于 2012-12-27T04:03:42.247 に答える
0

wp_footer()スクリプトの直後にフッターにjqueryを追加してみてください

<?php
    wp_enqueue_script('jquery');
    wp_enqueue_script('myscript', 'myscript.js', array('jquery'));
    wp_footer();
?>

次に、外部スクリプト：

$(document).ready(function () {
    $('body').hide();
    $('body').fadeIn(3000);
});
于 2012-12-27T04:01:01.763 に答える