ログイン

問題5 jqueryでsin,cosを使おう!

jQueryAnimationの問題

jQueryAnimation

jqueryでsin,cosを使おう!

問題

今回はsin、cosを使ってみましょう!
jqueryなどの言語の面白いところはこのように数学が使えるところだと思います。

自分の環境に書くコード

              <input type=>number> placeholder=>ここに数値を入力>>
<p>sin<span></span>=<span></span></p>
<p>cos<span></span>=<span></span></p>
¥HTML¥
            

期待する画面

コードのアイコン

解答ソースコード

              $(function () {
  $("input").change(function () {
    var angle= $(this).val(),
          rad=angle*(Math.PI/180),
          sin=Math.sin(rad),
          cos=Math.cos(rad);
    $("p").eq(0).find("span").eq(0).text(angle+"°");
    $("p").eq(1).find("span").eq(0).text(angle+"°");
    $("p").eq(0).find("span").eq(1).text(sin);
    $("p").eq(1).find("span").eq(1).text(cos);
  });
});
¥JavaScript¥
            
答えのアイコン

解説

まずinputが変更されたことをトリガーにします。そしてvalで数値を取得してきます。ここが今回1番大事なのですが、jqueryで使うsinやcosはradを単位としているので取得したangleをrad表記に変換します。rad表記ではπ=180度となるのでangleを180で割り、Math.PIはπ(3.14...)を表しており、これをangleにかけます。そして最後にMath.sin、Math.cosを使って処理を行い、その値を変数に代入します。今回の主目的はsin、cosをjqueryで使って値を得ることなので、残りの表示は好きなようにすればいいと思います。
ログインして解答を見る
完了にする!
LINEの友達追加でお役立ち動画をGET!!