1

次のサイトから qtip という単純なテキスト ヒント jquery をインストールしようとしています。http://craigsworks.com/projects/qtip2/、成功しませんでした。それは単に機能していません。エラーは発生していません。これを 1 時間以上トラブルシューティングしようとしています。

以下の私のコードは、クラスの空白の div です。ボックスがホバーされているときに、それが機能していることを確認するために、.somethinga を使用して任意のテキストを表示しようとしています。qtip

Javascript

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<script type="text/javascript" src="jquery.qtip.min.js"></script>
<script>
 $(document).ready(function(){
    $(".myform").validate({
        highlight: function(element, errorClass, validClass) {
             $(element).css('border', '1px solid red');
          },
          unhighlight: function(element, errorClass, validClass) {
             $(element).css('border', '1px solid #ddd');
          },
        messages: {
            first: "Please specify your name",
        }
    });

    $('.something').qtip('hello');
  });
</script>

マークアップ

<form class="myForm" method="post" action="action.php">
    First <input type="text" name="first" class="required"/><br/>
    Last <input type="text" name="last"  /><br/>
    Phone <input type="text" name="phone"  class="required"/><br/>
    <div class="something" style="border:1px solid red; height:150px; width:300px;"></div>
    <input type="submit">
</form>

何が問題なのかについての提案に感謝します。

よろしくお願いします！

4

2 に答える 2

0

div に title 属性を追加するのを忘れ、qtip 2 の css ファイルを含めなかったため、ツールチップが期待どおりに表示されません。

http://qtip2.com/v/nightly/jquery.qtip.css

この 2 つの手順を完了するだけで、コードが機能します。

デモ: http://jsfiddle.net/dzcc5/

于 2013-04-05T16:17:53.350 に答える