＜javascript＞計算した数値を分秒に変換する方法（全くの初心者です）

Question

前提・実現したいこと

全くの初心者です。
例えば、動画の時間などで分秒のある項目が複数あるとして、
チェックボックス で動画を選択して、
その動画の合計の試聴時間の合計値を計算し、
さらにそれを分秒にして表示させたいです。

発生している問題・エラーメッセージ

秒数の合計まではなんとかできたのですが、
その秒数の合計を分秒に変換する方法がうまくいかず困っています。

https://sterfield.co.jp/designer/jquery%E3%81%A7%E9%87%91%E9%A1%8D%E3%82%92%E3%82%AB%E3%82%A6%E3%83%B3%E3%83%88%E3%82%A2%E3%83%83%E3%83%97%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95/
このサイトのコードを参照しました。

該当のソースコード

<p class="List">
<label><input type="checkbox" value="1">動画A（<span class="sec">200</span>秒）</label>
<label><input type="checkbox" value="1">動画B（<span class="sec">400</span>秒）</label>
</p>

<p>秒数：<span class="total">0</span>秒</p>
<div id="Result">0</div>
        

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
var Length = num;
	$(".List :checkbox").click(function(){
		Count0 = 0; 
		$(".List :checkbox:checked").each(function(){
			Count0 = Count0 + removeFigure($(this).parent("label").find(".sec").text());
		});

	var Second = setInterval(function(){
		if(Length != Count0){ 
			if(Length < Count0){
				Length = Length + Math.round((Count0 - Length)/2); 
			}else{
				Length = Length - Math.round((Length - Count0)/2);
			}

			$(".total").text(addFigure(Length));
			}
		}, 20);
	});

	function addFigure(str) {
		var num = new String(str).replace(/,/g, "");
		return num;
	}
	
	function removeFigure(str) {
		var num = new String(str).replace(/,/g, "");
		num = Number(num);
		return num;
	}
	
});

    var num = "";
    var timeM = Math.floor(num % (24 * 60 * 60) % (60 * 60) / 60);
    var timeS = num % (24 * 60 * 60) % (60 * 60) % 60;
    var timeDMS = timeM + '分' + timeS + '秒';

var sampleArea = document.getElementById("Result");
sampleArea.innerHTML = timeMS;
</script>

</body>
</html>

試したこと

秒数を出してからその秒数を分秒に変換できないか試しましたが
うまくいきませんでした。。。
全くの見当違いでしたら申し訳ありません。。。
どうぞよろしくお願いします。

Comments

[tkturbo]

> var num = "";
> var timeM = Math.floor(num % (24 * 60 * 60)

↑この時点でエラー出てませんか？

[Lhankor_Mhy]

var num = 400;
とすると、
「6分40秒」
と表示されました。

ですので、問題なく計算できているように思います。
わからない部分は、タイトルと異なり、変換の方法ではないのでは？

[hanaco]

ありがとうございます。そうでした、変換の方法でした汗

Answer 1

秒数を出してからその秒数を分秒に変換できないか試しましたが

うまくいきませんでした。。。

まずは、算数の範囲で考えて数式を立ててみましょう。あとは、それをプログラムに書くだけです。

Answer 2

                var Second = setInterval(function () {
                    if (Length != Count0) {
                        if (Length < Count0) {
                            Length = Length + Math.round((Count0 - Length) / 2);
                        } else {
                            Length = Length - Math.round((Length - Count0) / 2);
                        }

                        $(".total").text(addFigure(Length));

// ここに入れる。
                        var num = Length; // ちょっと変える。
                        var timeM = Math.floor(num % (24 * 60 * 60) % (60 * 60) / 60);
                        var timeS = num % (24 * 60 * 60) % (60 * 60) % 60;
                        var timeMS = timeM + '分' + timeS + '秒';

                        var sampleArea = document.getElementById("Result");
                        sampleArea.innerHTML = timeMS;
// ここまで。
                    }
                }, 20);

Comments

[hanaco]

ありがとうございました。こんなど素人相手に書き換えていただいてありがとうございます。
無事表示できました。ありがとうございました；；

Answer 3

通算の秒数が取得できたのなら、それを６０で割ると分が出てきます
んで、６０で割った余りが秒数ですね