JavaScript - 異なるパッケージを選択して、対応する製品の価格を表示します

Question

画像の下の 3 つの価格は 3 つのパッケージの価格です。これらの 3 つのパッケージのいずれかをクリックすると、デフォルトの価格 980 も変更されることに注意してください。。 JSで実装するにはどうすればいいでしょうか？
< /p>

阿神 · Answer

これはタブスイッチで、現在の色をクリックすると、上に価格が表示され、下に表示されるということで理解できますか?

我想大声告诉你 · Answer

アイデアをください

各カラーブロックに対応する価格を追加します
クリックすると価格を取得し、タイトルの価格を置き換えます。

すべてはフロントエンドによって実装されます。

世界只因有你 · Answer

アヤックス。 1 回クリックして 1 回リクエストします。

PHP中文网 · Answer

異なる仕様は異なる価格を表示します。ページがロードされると、ユーザーは異なる仕様をクリックするだけでデータを取得する必要があります。バックグラウンドで実行されるため、サーバーに大きな負荷がかかり、価格データが 1 つだけでは、エクスペリエンスは良くありません。商品が店頭に置かれた後は、通常、価格を変更することはできません。ただし、最終的な価格はバックエンドに基づいている必要があり、価格を検証する必要があります。具体的な実装としては、仕様の初期化時に仕様ラベル属性に変更後の製品の価格を設定する必要があります。