例:アクションで
<span>Here </span>
<span>are </span>
<span>some </span>
<span>words </span>
<span>for </span>
<span>a </span>
<span>poem </span>
<script>
$("span").on("click", function() {
$(this).css("background", "black");
});
</script>
<style>
span {
cursor:pointer;
}
</style>
:確かhttps://jsfiddle.net/kylemartin/f16okqsq/
、私の例では停電をアン行うためのメカニズムを持っていませんが、それはチェックと同じくらい簡単ですスパンの背景色とそれが黒ならば、それを黒くしないでください。
私はこれがあなたが探しているものだと思います。そうでない場合は、私に知らせてください、私はそれを改善することができます。ちょっと醜いですが、それは目標を達成します。
このコードは何:
私たちがやることは、私たちが自分の<span>
秒にすべての単語を入れています。これは、各単語がクリック可能な「単位」になるように必要です。その後、<span>
のいずれかのクリックをリッスンするJavascriptのクリックハンドラを作成します。誰かが<span>
のいずれかをクリックすると、その背景色は<span>
に変更されます。私はちょうど良い測定のためのCSSを追加しました。ちなみに、CSS <style>
タグは、HTMLファイル(または外部スタイルシート)の<head>
に入れる必要があります。
このコードの問題:
もちろん、言葉this--することができます「のハイライトを消し」ではないとの1つのプライム問題があります。ただし、クリックした<span>
の背景色を確認するクリックハンドラーにif
ステートメントを追加するのと同じくらい簡単です。 <span>
に背景がない場合は、黒にします。 <span>
に黒い背景がある場合は、背景を削除します。私はあなた自身のためにその部分を理解できるようにします。 :)(良い学習経験)
私はあなたがいくつかのHTMLを提供し、あなたが仕事をしてくれればあなたを助けることができると思う。 –
@AlexanderTyapkov私の答えにはHTMLやCSSなどがありますか? :) –
@KyleMartinあなたが知っていることは、彼女がそれを自分で作った場合、人が何かを学ぶ可能性が高いことです。たとえそれが小さくて実装が簡単なものであっても! ;-) –