ふるログ

プログラム学習中の人が書くブログです。

【完全版】10連ガチャを再度作ってみた(5/17 jQueryにコード書き換え)

f:id:huru555:20170514193545j:plain

ぐっと

結果も表示されるようになったよ!

 

0回まわしたよ

★50回(1%)

0回(3%)

☆3:0回(96%)

 

前のをただ10回1発する仕様にしただけです。

 

 

ガチャの確率、何回連続で回すかを設定できるガチャも作っています。

こちらもどうぞ。

 

huru555.hatenablog.jp

 

ただいま、プログラムスキル不足により、10連ガチャの結果を全て表示させることができていません。

 

表示されてるのは10回目の結果です。

 

createElementsでやろうとしたらガチャを回すごとに10個ずつ結果が表示されて上書きされないので困っちゃいますね。

 

どうにかします。

 

createElementを駆使することで、なんとか10回の結果を表示させることができました。

 

しかし、するとリセットボタンを押しても前に作ったdiv要素が削除されず、リセットを押し、ガチャを回すごとにdiv要素が10個ずつ増えるというトンデモ仕様に変身してしまいました。

 

div要素が増えても表面上は変化はないし、どう影響するのかはわかりませんが、とりあえず改善せねばならないことは確かなので、リセットボタンを取り外しました。

 

解決しましたので、リセットボタンを再度設置しました。

 

リセットボタンを押しても、createElementでつくったdiv要素は削除されない仕様です。

 

ぶっちゃけ10個程度ならいちいちスクリプトで作らなくてもhtmlに自分で書けばいいのですが、100連1000連とこれからどんどん回数を増やしたいときがいずれ来るでしょうから、このようにわざわざスクリプトさんに作ってもらっています。

 

2017.5.17

JavaScriptからJQueryに書き換えました。

おそらくちゃんと動いていると思いますが、不安です。