基于行选择拆分链接数

时间:2018-01-11 09:35:53

标签: javascript jquery html css angular

我有2个下拉列表,

一个用于链接数量,另一个用于行数。根据行数选择,链接必须更改行。

例如。如果我选择链接数为5和行数为3,则表示5个链接必须分为3行

链接数为5,行数为4 = 结果应为第一行3,第二行2第四行第1行

链接数为7且行数为4 = 结果应为第一行4,第二行2和第三行为1

第一行最多可以有5个列。

我创造了小提琴并且不确定任何帮助https://jsfiddle.net/hnqxe7dc/

的逻辑



$("#rows").change(function() {
    var str = "";
    $("#rows option:selected").each(function() {
      str += $(this).text() + " ";
    });

  })
  .change();

$("#nrGames").change(function() {
  var value = +$(this).val();
  var nr = 0;
  var elem = $('#games').empty();
  while (nr < value) {
    elem.append("<li><a href='#'><label for='" + "menuItemId" + "'><input type='checkbox' id='" + "menuItemId" + "' checked='checked' /> Menu Item " + nr + "</label></a></li>");
    nr++;
  }
});
&#13;
div {
  color: red;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<lable> Select Link</lable>
<select id="nrGames" name="nrGame">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<lable> Select Rows</lable>
<select name="sweets" id="rows">
  <option>1</option>
  <option selected="selected">2</option>
  <option>3</option>
  <option selected="selected">4</option>
  <option>5</option>
  <option>6</option>
</select>
<div id="games"></div>
&#13;
&#13;
&#13;

0 个答案:

没有答案