Question

寻找任何PHP，Jquery，javascript解决方案，用逗号分隔数据并将其转换为无序列表。

为了进一步解释，我已经将一个CSV文件导入到wordpress中，一个元素块包含许多以逗号分隔的数据，我需要将其显示为列表。

感谢所有帮助！

Answer 1

在PHP中

$list = 'item1,item2,item3,item4';
$list = explode(',', $list);
shuffle($list);
$html = '<ul>';
foreach($list as $item) {
    $html .= '<li>' . $item . '</li>';
}
$html .= '</ul>';

print $html;

在JavaScript中

var list = 'item1,item2,item3,item4';
list = list.split(',');
list.sort(function() { return 0.5 - Math.random() });
var html = '<ul>';

 for(var i=0; i<list.length; i++) {
    html += '<li>' + list[i] + '</li>';
  }

html += '</ul>';

Answer 2

有更简洁的方法可以写这个，但希望这会让你知道如何使用jQuery完成它。

$(function(){
  $csv = $("#csv")
  items = $csv.text().split(",")
  $csv.replaceWith($("<ul/>"))
  items.forEach(function(item){
      $("ul").append("<li>"+item+"</li>")
  })
})

这是小提琴：http://jsfiddle.net/JmwDw/

Answer 3

HTML

<ul id="ul-test">
</ul>

的JavaScript

var CSV = "a,b,c,d,e";
var arrCSV = CSV.split(','),
    ul = document.getElementById("ul-test");

for (var i = 0, len = arrCSV.length; i < len; i++) {
    var li = document.createElement("li");
    var text = document.createTextNode(arrCSV[i]);
    li.appendChild(text);
    ul.appendChild(li);
}

JSFiddle

将逗号分隔列表转换为无序列表

3 个答案: