使用Javascript从用户输入(由换行符分隔)制作数组

时间:2016-10-28 12:04:51

标签: javascript jquery arrays user-input

我试图以很多字符串的形式接受用户输入。我想将它们存储在一个数组中,输入应该用换行符分隔。

应该非常像这样:https://www.random.org/lists/

我无法理解在哪里 - 有人可以帮忙吗?我正在使用JavaScript,但使用JS或jQuery的任何解决方案都会很棒!

我已经发布了我的JS。我希望var用户来自用户输入,而不是自己填充数组。

谢谢,

 $(document).ready(function() {
   $(".btn").on('click', function() {
     var people = ["Markus Eriksson", "Leticia Hoshino", "Yemi Afolabi", "Eskil Fogelström", "Josefina Liedberg", "David Bjørn Bograd", "Tilda Dahlgren", "Damien Vignol", "Sofie Cousu", "Carolina Lindelöw", "Bilal Khan", "Louise Brandrup-Wognsen", "Emilia Lehto", "Albin Hagström",
       "Victor Borg", "Anna Stella Lo-Ré", "Loucmane", "Angelica Ruth", "Victoria VL", "Johan Hellström", "Micke Skoglund", "Anna Unger", "Isaac Sennerholt", "Cyndie Léa Vintilescu", "Mahle Rakela Robin", "Louise Ek", "Ibrahim Bajwa", "Abodi Ismail",
       "Alex Ashman", "Elin Grass Casalini", "Amanda Schultz", "Abenezer Abebe", "Julia Hoff", "Enny Hellsén", "Michel George", "Abdullahi Hussein", "Teodor Meurling", "Andrea Sami Mogren", "Thea Arpine Gasparyan", "Jakob Eberson"
     ];
     var groupSize = $("input[name=checkListItem]").val();
     var groups = [];

     $(".group").remove();

     // Randomizing function
     Array.prototype.shuffle = function() {
       var input = this;

       for (var i = input.length - 1; i >= 0; i--) {

         var randomIndex = Math.floor(Math.random() * (i + 1));
         var itemAtIndex = input[randomIndex];

         input[randomIndex] = input[i];
         input[i] = itemAtIndex;
       }
       return input;
     };

     people.shuffle();

     // Split people into chunks and push new arrays into var groups
     while (people.length > 0) {

       chunks = people.splice(0, groupSize);
       var chunksSpace = chunks.join(', ');

       groups.push(chunksSpace);
     }

     // Append the groups into the DOM
     $(document).ready(function() {
       for (var i = 0; i < groups.length; i++) {
         $('.all-groups').append("<div class='group'><p><span class='groupheader'>Group " + (i + 1) + "</span></br> " + groups[i] + "</p></div>");
       }
     });
   });
 });

3 个答案:

答案 0 :(得分:0)

var text = $('#total-number').text();
var eachLine = text.split('\n');
  alert('Lines found: ' + eachLine.length);
  for(var i = 0, l = eachLine.length; i < l; i++) {
      alert('Line ' + (i+1) + ': ' + eachLine[i]);
  }

答案 1 :(得分:0)

使用split将多行字符串拆分为多个部分:

&#13;
&#13;
var textarea = document.querySelector("textarea");

textarea.addEventListener("change", function(e) {
    console.log(textarea.value.split((/[\n\r]/g)));
});
&#13;
<textarea></textarea>
&#13;
&#13;
&#13;

正则表达式链接:

答案 2 :(得分:0)

纯Javascript

document.getElementById("element_id").value.split("\n");

或JQuery $("#element_id").val().split("\n");

对于您的示例,请提供您的输入id='people'并且应该有效,同时避免.replace(/\n+/g,"\n")之外的额外换行符。

 $(document).ready(function() {    
     // Randomizing function
     Array.prototype.shuffle = function() {
       var input = this;

       for (var i = input.length - 1; i >= 0; i--) {

         var randomIndex = Math.floor(Math.random() * (i + 1));
         var itemAtIndex = input[randomIndex];

         input[randomIndex] = input[i];
         input[i] = itemAtIndex;
       }
       return input;
     };

   $(".btn").on('click', function() {
     var people = $("#people").val().replace(/\n+/g,"\n").split("\n");
     var groupSize = $("input[name=checkListItem]").val();
     var groups = [];

     $(".group").remove();

     people.shuffle();

     // Split people into chunks and push new arrays into var groups
     while (people.length > 0) {

       chunks = people.splice(0, groupSize);
       var chunksSpace = chunks.join(', ');

       groups.push(chunksSpace);
     }

     // Append the groups into the DOM
     $(document).ready(function() {
       for (var i = 0; i < groups.length; i++) {
         $('.all-groups').append("<div class='group'><p><span class='groupheader'>Group " + (i + 1) + "</span></br> " + groups[i] + "</p></div>");
       }
     });
   });
 });