0

私は JS が初めてで、The Odin Project のレッスンに取り組んでいます。私は最初の JS/JQuery プロジェクトを使用していますが、このプロジェクトで問題が発生しています。

JS/JQuery を使用して、ユーザーが 1 ～ 16 の数字を入力すると、ページのサイズに合わせてグリッドが表示されるようにするにはどうすればよいですか。つまり、ユーザーが 3 と入力すると、3x3 グリッドで Web ページのサイズが出てきます。または、ユーザーが 16 と入力すると、16x16 のグリッドが出てきますか?

私は率直な答えを望んでいませんが、誰かがスターターコードで正しい方向に向けることができればどうでしょうか? 最善の方法は、div を作成して .append() 関数を使用することだと思いますか? ここでもう少し方向性が必要です。

4

1 に答える 1

0

これがあなたが必要とする不可解な応答です。空白を埋める方法を含め、テーブルを拡張して画面を埋める方法を省略しました。ヒント: $(window).height()/$(window).width() を使用して、画面のサイズを取得します。

$('#grid').change(function(){
    $('table').remove();
    var code = "<table>";
    for (var i = 0; i < $('#grid').val(); i++)
    {
        code += "???";
        for (var j = 0; j < $('#grid').val(); j++)
        {
            code += "???";
        }
        code += "???";
    }
    code += "</table>";
    $('#container').append(code);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
    <label>Grid Size</label>
    <input type="number" id="grid" />
</div>

于 2015-07-01T22:15:33.617 に答える