2

私はJqueryを初めて使用します。アプリケーションでバウンス効果を使用したいのですが、ここでサンプルコードを確認しました。そこでは機能しますが、システムにコピーして保存すると機能しません。JSエラーが発生します：オブジェクトはメソッド/プロパティ'効果'をサポートしていません。

何か案は？これが私のコードです、

<!DOCTYPE>
<html>
<head>
<title>Bounce Effect</title>
   <script type="text/javascript"  src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script>
     $(document).ready(function() {

      $("#button").click(function(){
         $("#Target").effect( "bounce", {times:3}, 300 );
      });
   });
   </script>

   <style>
      p {
           background-color:#bca;
           width:200px; 
           border:1px solid green; 
        }
     div{ width:100px; 
            height:100px; 
            background:red;  
        }
  </style>
</head>

<body>

   <p>Click the button</p>
   <button id="button"> Bounce </button>

   <div id="Target" class="target" >
   </div>  
</body>

</html>
4

4 に答える 4

4

これらのエフェクトを使用するには、適切なライブラリが必要です。

提供した例では、JQuery UIへのリンクがあり、これには「バウンス」効果と.effect機能があると思います。

<script type="text/javascript" src="/jquery/jquery-ui-1.7.2.custom.min.js"></script>

したがって、彼のカスタムJQuery UIをGoogleのものに切り替えた後、これを試してください

<!DOCTYPE>
<html>
<head>
<title>Bounce Effect</title>
   <script type="text/javascript"  src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
   <script type="text/javascript"  src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    <script>
     $(document).ready(function() {

      $("#button").click(function(){
         $("#Target").effect( "bounce", {times:3}, 300 );
      });
   });
   </script>

   <style>
      p {
           background-color:#bca;
           width:200px; 
           border:1px solid green; 
        }
     div{ width:100px; 
            height:100px; 
            background:red;  
        }
  </style>
</head>

<body>

   <p>Click the button</p>
   <button id="button"> Bounce </button>

   <div id="Target" class="target" >
   </div>  
</body>

</html>

あなたはここでそれについてもっと学ぶことができます。JQueryとJQueryUIにはかなり広範なドキュメントがあるため、それらを読む必要があります。

また、ここにあなたが...いじくり回すためのJSFiddleがあります。例を作成したり、何かをすばやくテストしたりする場合に便利です。

于 2012-02-24T14:50:45.673 に答える
1

このJavaScriptファイルを含めるのを忘れている可能性があります。 

 src="/jquery/jquery-ui-1.7.2.custom.min.js"></script>
   <script type="text/javascript" language="javascript">

これは、バウンス効果を機能させるために使用したカスタマイズされたjQueryです...

ここでコードを取得できます：

http://www.tutorialspoint.com/jquery/jquery-ui-1.7.2.custom.min.js

于 2012-02-24T14:50:03.497 に答える
1

$.fn.effectはjQueryUIメソッドであるため、使用するにはページにjQueryUIを含める必要があります。

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
于 2012-02-24T14:50:05.643 に答える
0

サンプルでは次の2つのjsファイルが使用されていることがわかります。

<script type="text/javascript" src="/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="/jquery/jquery-ui-1.7.2.custom.min.js"></script>

これら2つのファイルの機能はありますか？

于 2012-02-24T14:50:34.633 に答える