Javascript преобразовать строку в массив с флажком для каждого массива

Question

пожалуйста см jsfiddle

Я хочу, чтобы выходной флажок для каждого массива.

1. Как создать массив?
2. Как добавить флажок с уникальным именем в массив?

Что бы ни было в текстовом поле, отдельные слова и конвертировать чек-бокс

JQuery:

$(document).ready(function() { 
    $(".step1_btn").click(function() { 
     var text = $(".source").text(); 
     text = text.replace(/\W+/g, ','); 
     $('.splited').html(text); 
    }); 
}); 

HTML:

<textarea class="source">Jusf to clarify, I will to have strings of varying</textarea> 
<button type="button" class="step1_btn">Display Date</button> 
<div id="demo" class="splited"></div> 

Answer 1

Я считаю, что вы пытаетесь разделить слова в текстовом поле в отдельные флажки, то это будет делать:

$(".step1_btn").click(function() { 

    var text = $(".source").text(); 
    var parts = text.split(" "); 

    for (var i = 0; i < parts.length; i++) { 
     var input = "<input type='checkbox' value='" + i + "'/>"; 
     var cbLabel = "<label>" + parts[i] + "</label>"; 
     $("#demo").append(input + cbLabel); 
    } 
}); 

Демо: http://jsfiddle.net/JWPZh/2/

Answer 2

Вы можете попробовать что-то вроде

$(".step1_btn").click(function() { 

     var text = $(".source").text(); 

     text = text.replace(/\W+/g, ','); 

     $('.splited').html(text); 

     $.each(text.split(','), function (index, value) { 
      // Check if it is already added 
      if (!$("#" + value).length) { 
       // Dont exist add new one 
       $("#demo").append("<input id=" + value + " type='checkbox' value='"+ value+"' />" + value); 
      } 
     }); 

    }); 

Answer 3

Возможно, это то, что вы после этого?

var source = $(".source").text() 
var array = [] 
$.each(source.split(/\W+/g), function(i, v){ 
    array.push($("<input type=checkbox id='"+v+"' value='"+v+"'/>")) 
}) 

array будет содержать <input> элемент для каждого слова в строке источника

Answer 4

Я интерпретируюсь с вашим вопросом следующим образом:

1. Разбить текст в элементе TEXTAREA с использованием одного пустого пространства, как разделитель.
2. Используйте результирующий массив для создания ввода и соответствующих элементов ярлыков.

Если это так, то приведенный ниже код должен удовлетворить ваши потребности.

$(document).ready(function() { 
    $('.step1_btn').on('click', function() { 
     var counter = 0, 
      fragment = document.createDocumentFragment(), 
      parts = $('.source').text().split(' '), 
      length = parts.length, 
      input, 
      label; 

     for (; counter < length; counter += 1) { 
      label = document.createElement('label'); 
      label.innerHTML = parts[counter]; 
      label.setAttribute('for', parts[counter]); 
      input = document.createElement('input'); 
      input.setAttribute('type', 'checkbox'); 
      input.setAttribute('name', parts[counter]); 
      fragment.appendChild(label); 
      fragment.appendChild(input); 
     } 
     $(document.getElementById('demo')).append(fragment); 
    }); 
}); 

fiddle