1

少し動的なツールチップ関数を作成しています。

基本的に私がそのようなリンクを持っている場合：

<a href="#" data="xyz">?</a>

qTipを使用して、mysqlでツールチップテーブルを検索し、data属性のデータに基づいてチップを取得しようとします。

それで：

$('a[data]').qtip({ 
    content: {
       url: '/tooltip.php',
       data: { tipKey: $(this).attr('data') },
       method: 'post'
}
});

問題は、それが機能しないことです。$（this）.attr（'data'）は、属性内の値をプルしていないようです。

次のように手動で機能を変更しても問題ありません。

    $('a[data]').qtip({ 
    content: {
        url: '/tooltip.php',
        data: { tipKey: 'xyz' },
        method: 'post'
    }

});

データ属性からデータをプルしようとしているときに何が欠けていますか？私は次のようなことをする必要があります：

    $('a[data]').qtip({ 
    content: {
        url: '/tooltip.php',
        data: { tipKey: ''+$(this).attr('data')+'' },
        method: 'post'
    }

});

それも価値を生み出していないので！

4

3 に答える 3

4

thisキーワードは実行中の関数のコンテキストを表し、オブジェクトリテラル内で使用しているため、コードは機能しません。

たとえば、$(document).readyイベントでスニペットを実行すると、thisキーワードはドキュメント要素を表します。

セレクターを繰り返し処理して、各要素のツールチップを個別に初期化できます。

$('a[data]').each(function () {
  var $link = $(this);
  $link.qtip({ 
      content: {
        url: '/tooltip.php',
        data: { tipKey: $link.attr('data') },
        method: 'post'
      }
  });
});

dataまた、この属性は標準ではないことに注意してください。ページはW3CValidatorに合格しません。

于 2009-10-12T04:07:53.480 に答える
1

この例は私のために働きます：

<html>
<head>
<title>Text</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
  alert($("a[data]").text());
});
</script>
</head>
<body>
<a href="#" data="123">abc</a>
</body>
</html>
于 2009-10-12T03:55:00.540 に答える
1

データの0番目の要素にアクセスしてみてください。このような：

data: { tipKey: $("a[data]")[0].data},

編集：ああ、わかりました、なるほど、これは代替手段として機能するはずです。

于 2009-10-12T03:58:43.310 に答える