2

私は以下のコードを持っています:

<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  <script src="http://ui.jquery.com/latest/ui/effects.core.js"></script>
<style type="text/css">
  p { cursor: pointer; font-size: 1.2em; }
  .selected { color:red; }
</style>
  <script>
  $(document).ready(function() {
    $('p').click(function () {
      $(this).removeClass('selected', 1000);
      $(this).removeAttr('class');
      //$(this).removeAttr('style');
    });
  });
  </script>
</head>
<body style="font-size:62.5%;">

<p class="selected">Click me to remove 'selected' class.</p>
<p class="selected">Click me to remove 'selected' class.</p>
<p class="selected">Click me to remove 'selected' class.</p>

</body>
</html>

したがって、いずれかをクリックする<p>と、クラスが削除され、属性クラスも削除されます。ただし、コードstyle=""がのインラインに挿入され<p>ます。

なぜこれが発生し、どのように削除しますか?要素をクリックした後の私にとって<p>、新しい定義は<p>単に<p>some text goes here</p>

4

1 に答える 1

3

jquery-ui removeclass()が原因でスタイルが存在する理由は、ドキュメントにはありませんが、アニメーションの実行後に実行されるコールバックを使用するために使用できる引数(sourceを参照)が多いようです。

$(document).ready(function() {
    $('p').click(function () {
        $(this).removeClass('selected', 1000, function() {
            $(this).removeAttr('style').removeAttr("class");
        });
    });
});

(そもそもなぜこれをやりたいのかわかりません)。

デモ: http: //jsbin.com/opucon/2/(結果デモ)

于 2012-09-12T13:19:13.867 に答える