私は以下のコードを持っています:
<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>