0

リンクからtitle属性を削除してツールチップに再利用しようとしています。これが、問題を引き起こしているコードのスニペットです。

 $('.location').each(function() {
    var $this = $(this);
    $this
      .data('title', $this.attr('title'))
      .removeAttr('title');
  });


$('.location').hover(function(e) {
    //hover over code   

    //grabs what's inside the title attribute in the html
    var titleText = $(this).data('title');

    //saves the tooltip text using the data method, so that the orignal tooltip text does not conflict
    $(this)
        .data('tipText', titleText)
        .removeAttr('title');

ここで検索して、次のコードを含めました。

   $('.location').each(function() {
    var $this = $(this);
    $this
      .data('title', $this.attr('title'))
      .removeAttr('title');
  });

これはうまく機能していますが、IE8のリンクに戻ると、元のツールチップが再び表示されます。これに対する解決策はありますか？ありがとうございました！

4

1 に答える 1

2

title属性をtitle以外に変更できますか? タイトルは予約語であり、問​​題が発生する可能性があると思います。

非動作: (以下のコードで更新され、動作するようになりました)

http://jsfiddle.net/abZ6j/3/

<a href="#" title="foo" class="location">Test Link</a>​

$('.location').each(function() {
    var $this = $(this);
    $this
        .data('title', $this.attr('title'))
        .removeAttr('title');
});​

働く：

http://jsfiddle.net/abZ6j/1/

<a href="#" linkTitle="foo" class="location">Test Link</a>​


$('.location').each(function() {
    var $this = $(this);
    $this
        .data('title', $this.attr('linkTitle'))
        .removeAttr('linkTitle');
});​

更新しました：

実際、詳しく見てみると、タイトルを使用できますが、この特定の例では、$.data() の外でアクセスする方がよい場合があります。おそらく次のようなものです：

var $this = $(this);
var t = $this.attr('title');
$this
  .data('title', t)
  .removeAttr('title');
  • 上記を反映するために、「動作しない」jsFiddle コードを更新しました。
于 2012-11-20T18:48:39.560 に答える