1

私がやろうとしているのは、特定の数の div を作成するための for ループを作成することです。div の数は、データベースにある情報によって異なります。たとえば、15 個のチェックボックスがあります。ユーザーがクリックしたチェックボックスごとに div を作成するには、for ループが必要です。今のところ、mysql 側については心配していません。for ループに集中しているだけです。

だから私は800px幅のメインdivを持っています。ユーザーが 8 つのチェックボックスをクリックするとしましょう。それぞれ 200px 幅の 4 つの div の 2 つの行を作成する for ループを作成する方法を理解したいと思います。したがって、各行に 4 つの div があります。現在、div に何があるかは問題ではありません。このようなことに取り組む方法を知る必要があるだけです。

私を正しい方向に導くアイデアはありますか?

ここにいくつかのコードがあります:

$(document).ready(function(){
    for(i = 0; i < (the number of checkboxes clicked); i++) {
        $('body').append('<div id="div'+ i +'" />');
    }
});

次に、divには、幅200pxの何とか何とか何とかのような同じCSSコードが含まれます...

データベースからクリックされたチェックボックスを取得し、各チェックボックスのdivを作成する必要があると思います。

4

4 に答える 4

1
var n_checked_checkboxes = $('input[type="checkbox"]:checked').length;
for (var i = 0; i < n_checked_checkboxes; i++) {
    $('<div/>', {
        'id': 'div' + i,
        'class': 'some_class_name'
    }).appendTo('body');
}
.some_class_name {
    width: 200px;
    float: left;
}

body幅が 800pxの場合float: left、最初の行がいっぱいになると (4 div)、2 番目の行が表示されます。

そして、ここに例があります:http://jsfiddle.net/DvjxL/

于 2013-05-08T21:36:19.947 に答える
0

テーブルで 2 次元座標を取得する一般的な方法は、次の式です。

var items = ['first','second','third',....,'tenth'];
var n = items.length; // here: 10
var columns = 4;
var rows = Math.ceil(n/columns); // = 3
for (var i=0;i<n;i++) {
    var coords = {
        row: Math.ceil((i+1)/columns), // will return something between 1 and 4
        col: i % columns, // will return something between 0 and 3
    };
    doSomeThingWithItem(items[i],coords);
}
于 2013-05-08T21:28:00.947 に答える
0

これは、この回答のわずかに変更されたバージョンです(フォーム内のすべてのチェックボックスを数える方法(Javascript)):

<script type="text/javascript">
var inputTags = document.getElementsByTagName('input');
var checkboxCount = 0;
for (var i=0, length = inputTags.length; i<length; i++) {
     if (inputTags[i].type == 'checkbox' && inputTags[i].checked) {
         checkboxCount++;
     }
}

for(i = 0; i < checkboxCount; i++) {
    $('body').append('<div id="div'+ i +'" />');
    //morestuff, div related
}    
</script>

チェックボックスであり、チェックされているすべての入力をカウントします。その数で、あなたはforあなたが作ったものをします。

于 2013-05-08T21:24:57.360 に答える