4

Здравствуйте. Помогите перемешать строки в textarea средствами только JQuery

Есть форма, в ней только адреса сайтов которые всегда начинаются на http или https

<textarea id="siteList">
https://vk.com
https://mail.google.com
http://ru.stackoverflow.com
http://enjoycss.com
<textarea>

Как при нажатие на кнопку Перемешатьперемешать все адреса сайтов которые в textarea

Вот мое начало

<script type="text/javascript">
$('html').on('click','#gositelist',function (){
var sitelist = $('#siteList').val();
var arrSitelist = sitelist.split('http');
arrSitelist.sort(function() { return 0.5 - Math.random() });
alert(arrSitelist);
}); 
</script>

Преобразовал строку sitelist в массив, но перемешать мне его нормально так и не удается.

2 ответа 2

3

Решение на jQuery:

$.fn.shuffleValueRows = function() {
  var rows = this.val().trim().split('\n');
  var shuffled = shuffle(rows).join('\n');
  this.val(shuffled);
  return this;
  
  function shuffle(o) {
    for(var j, x, i = o.length; i; 
      j = Math.random() * i |0, 
      x = o[--i], 
      o[i] = o[j], 
      o[j] = x);
    return o;
  };
}


$(document).on('click', '.shuffleBtn', function() {
  $($(this).data('selector')).shuffleValueRows();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<textarea id="siteList" rows=5 style="width: 100%">
https://vk.com
https://mail.google.com
http://ru.stackoverflow.com
http://enjoycss.com
</textarea>

<hr />
<button class="shuffleBtn" data-selector="#siteList">Shuffle!</button>

1
  • Я 3 - Дня мучался, 3 дня. А тут за 2 минуты решили. Спасибо огромнейшие. 13 мар 2017 в 12:09
2

Ну как-то так:

document.querySelector('#shuffle').addEventListener('click', _ => {
  let textarea = document.querySelector('#siteList');
  
  textarea.value = textarea.value.split(`\n`).filter(_ => _).reduce((a, e) => (a.splice(Math.random() * (a.length + 1), 0, e), a), []).join(`\n`);
  /*var chanks = textarea.value.split("\n"),
      shuffled = [];
  
  for(var i = 0; i < chanks.length; i++){
    var chank = chanks[i];
    
    if(/^\s*$/.test(chank)){
      continue;
    }
    
    shuffled.splice(Math.random() * (shuffled.length + 1), 0, chank);
  }
  
  textarea.value = shuffled.join("\n");*/
});
textarea{
  width: 250px;
  height: 100px;
}
<textarea id="siteList">
https://vk.com
https://mail.google.com
http://ru.stackoverflow.com
http://enjoycss.com
</textarea><br />
<input type='button' id='shuffle' value='Перемешать!' />

7
  • Че то не работает у меня. Вставляю Ваш код в свою html страничку и ноль. Консоль говорит SyntaxError: missing ; before statement 12 мар 2017 в 19:20
  • @Анатолий, в сниппете код выполняется успешно. Как Вы вставляете?
    – user207618
    12 мар 2017 в 20:11
  • да в ЯНдекс браузере тоже работает, это у меня в лисе 28.0 не работает, но дело в том что мне как раз под эту версию нужно. 12 мар 2017 в 20:28
  • @Анатолий, где Вы такого динозавра откопали? И зачем поддержка именно под него? Попробуйте код из комментария.
    – user207618
    12 мар 2017 в 20:54
  • 1
    @Анатолий, это точно должно помочь.
    – user207618
    12 мар 2017 в 21:23

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.