1.プロジェクトの製品評価ページに遭遇しました。これには、製品の星評価が含まれていました。その時点で、私はその効果を書き留めました（つまり、ユーザーがいくつかの星をクリックしていくつかの明るい星を表示しました）。
私がページを作り、それを私のバックエンドの同僚に引き渡したとき、彼は私がこれをすることは無意味であり、彼はそれをすることができなかったと言いました。当時、私の心は少し混乱していました。
その後、バックエンドの私の同僚は、彼がトラブルを起こすだろうと言った。 21世紀の晴れた若者として、どうして彼の同僚に彼が彼の仕事を完了するのを助けることができるでしょうか？
私の同僚のアドバイスと私自身の探検を通して、私はついにここで関係を理解しました。次に、このプログラムを作成する方法と、自分の言葉を通してどのような操作を行うべきかを説明します。
A、写真は上にあります：
B：上記の写真では、5つのライトの1つと、他の4つのライトをレビューしました。このようなものは何ですか？以下の写真を参照してください：
はい、はい、スタートスターの明るい星の数はデータのためです
C：このデータについて話すことができますが、このデータは何ですか？
フロントエンドとバックエンドは、データが保存される場所に同意したことがわかりました（TADAまたはTDATという名前を与えることができます）。バックエンドはそれに値を割り当てることができ、データはそのように多くの星に等しくなります。しかし、なぜこのデータが必要なのですか？
Jiang Zi：ユーザーAがスターをクリックすると、ユーザーBユーザーCユーザーDに表示できます。そのため、ユーザーがクリックした星の数は、背景を取得できるように特定の場所（つまり、データ）に保存（割り当てられます）が必要です。
つまり、フロントエンドは値を割り当て、バックエンドは値を取得し、バックエンドは取得したデータをデータベースに保存し、それをデータに再割り当てして、ユーザーAが評価した肯定的な星の数を表示します。
フロントエンドの割り当て------》バックエンド値 - 》バックエンドストレージデータ - ストアーされたデータに基づいてフロントエンドへのバックエンドフィードバック-
OK、ロジックを理解している場合は、プログラムを書くことができます。
$（ '。evaluate_mark'）。各（function（）{var star = $（this）.find（ '。u-grade'）。 div '）。各（function（i、ele）{// eleの現在の要素、i current要素のインデックスif（i <star）{ / *alert（i）; * / *alert（ele）; * /$（ele）.addclass（' light '）;}}）;}）;上記のコードは比較的簡単です。まず、繰り返して、下のdivを見つけます。つまり、u-grada_item、
見つけた後、すべてのライトを取り外し（ライトはCSSで星を照らすクラスです）、U-Grada_itemを横断します。 Starはデータ値を取得し、i <Starに基づいて判断されました。
これは、星の明るさの数を示しています。つまり、上の最初の画像は明るく、1つは明るく、1つは明るく、1つは明るく、明るく、明るく、もう1つは明るく、もう1つは明るく、もう1つは明るく、数は明るく、数は明るくなります。
4.1：この時点で、バックエンドの割り当てとフロントエンドのパフォーマンス効果を完了しました。現時点ではまだ2つのピースが残っています。
1つはユーザーがクリックして効果を生成する部分であり、もう1つはユーザーのクリックの値をデータ上の現在のスターのクリックを割り当てることです（バックエンドを保存し、値を再割り当てして表示します）
4.2：ユーザーのクリックの効果を示すために次のことをしましょう
$（function（）{$。setGrade= function（$ ele、index）{var $ item = $ ele.find（ "。u-grade_item"）; $ item.removeclass（ "light"）; $ item.slice（0、index+1）.addclass（ "light"）; .u-grade_item "）; $ item.click（function（）{var $ this = $（this）; /*現在の$ itemオブジェクトを保存する変数を定義する変数* /var index = $ this.parent（"。u-grade_item "）。 Element/ *Alert（index）;A：コードの実装について1つずつ話しません。コメントを読むことができます。このようにして、ユーザーはクリックして効果を生成します。以下の最後のものだけがあります。ユーザーがクリックした星の値をデータに割り当てます。
それを明確にするのは簡単です：
（function（）{var $ item = $（ "。u-grade .u-grade_item"）; $ item.click（function（）{var $ this = $（this）; var index = $ this.parent（ "。u-grade_item"）。元のデータ値を変更する$ .setGrade（$ this.parent（）、index）;さて、この記事のコンテンツ全体が紹介されました。私はそれが誰にでも役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は、すべての人に時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます！