0

我有一个很长的 html 菜单列表（大约 30 个菜单位置），我试图根据 .csv 文件动态填充标签。我想更改每个菜单标签，即“插槽”。每次加载页面时，我都需要查找 position1，并在我指向的页面中返回正确的标签和标题标签。有很多固定位置，但是当.csv文件更新时，菜单标签需要相应改变。为了火上浇油，如果找不到 .csv 第一列中的位置，我需要隐藏一个菜单。这位绝对的业余爱好者将不胜感激您可能拥有的任何见解。

CSV 文件保存到目录

position1,Slot1 
position2,Slot2
position3,Slot3
position4,Slot4

HTML

<a href='link'>
<span class='hidden-minibar'>Slot 1 </span>
</a>
</li>
<a href='gohere'>
<span class='hidden-minibar'>Slot 2 </span>
  </a>
  </li>                                                                        
<a href='link'>
<span class='hidden-minibar'>Slot 3 </span>
</a>
</li>
<a href='link'>
<span class='hidden-minibar'>Slot 4 </span>
</a>
</li>
4

1 回答 1

1 
                   if (window.FileReader) {
                        var reader = new FileReader();
                        reader.onload = function(filedata) {
                            var list = filedata.target.result;
                            csvParser(list);
                        };
                        reader.readAsText(this.selectedfile.target.files.item(0));
                    }

var  csvParser  =  function(list) {
            var quoteRegexp = new RegExp("^\"(.*)\"$");
            var data = [];
            var lines = list.split(new RegExp("\r?[\r\n]"));

            for (var iCtr = 0; iCtr < lines.length; iCtr += 1) {
                var fields = lines[iCtr].split(",");
                for (var jCtr = 0; jCtr < fields.length; jCtr += 1) {
                    fields[jCtr] = fields[jCtr].replace(quoteRegexp, "$1");
                }
                data.push(fields);
            }

           return data;

      }

使用 FileReader 对象并读取客户端站点上的 csv 文件

使用 csvParser 函数解析行 csv 数据

在 csvParser 函数结果数据上创建动态 html 和适当的逻辑。

基本 csv 读取示例 http://jsfiddle.net/techrevolt/W8fME/

于 2014-04-12T07:26:47.357 回答