0

我已经详尽地浏览了互联网以找到解决此问题的方法。
所以我有一个 jquery ajax 脚本，它加载到一个 csv 文件中并生成一些将数据合并到 csv 文件中的 html 代码。

<script type="text/javascript">
    $(document).ready(function() {
    $.ajax({

       type: "GET",
       url: "database.csv",
       dataType: "html",
       data: {},
       success: function(text) {
           // Location of key information
           var nameLoc;
           var siteLoc;
           var typeLoc;
           var categoryLoc;
           var descripLoc;
           var canRequestLoc;
           var EClassLoc;
           var description='';
           var temp = "Y";
           var charTemp;
           var site;
           var len;
           var fields = text.split(/\n/);
           fields.pop(fields.length-1);

           var headers = fields[0].split(','), html = '<table align="center" id="searchData">';

           for(var i = 0; i < headers.length; i += 1) {
              switch (headers[i]){
                case 'Name':
                    nameLoc = i;
                 break;
                case 'RequestSystem':
                    siteLoc = i;
                break;
                case 'Type':
                    typeLoc = i;
                break;
                case 'Category':
                    categoryLoc = i;
                break;
                case 'canRequest':
                    canRequestLoc = i;
                break;
                case 'ECAPSClassification':
                    EClassLoc = i;
                break;
                case 'Description':
                    descripLoc = i;
                break;
              };
           }
           descripLoc = canRequestLoc + 2;

           var data = fields.slice(1, fields.length);

           for(var j = 0; j < data.length; j += 1) {

              var dataFields = data[j].split(',');
              if (dataFields[nameLoc]==0){
                html += '</table>';
                $(html).appendTo('body');
                break;
              };

              html += '<tr>';
              html += '<td class="demo-show"> <h3>' + dataFields[nameLoc] +  '</h3>';
              html += '<div class="menuBar"> ';

              charTemp = dataFields[canRequestLoc];
              if (charTemp=='Y'){
                switch (dataFields[siteLoc]){
                    case 'Service Now':
                        site = 'https://ccsn.service-now.com/'; 
                        break;
                    case 'CCR IdM':
                        site = 'http://idm.na.cokecce.com'; 
                        break;
                    case 'ECAPS':
                        site = 'https://ecaps.cokeccr.com/ecaps';   
                        break;
                    case 'KO IdM':
                        site = 'https://apps.ko.com/idm';   
                        break;
                    default:
                        site = 'default';   
                        break;
                };
                html += '<a href="' + site + '">' + 'Request Access' + '</a><br>';
              }
              else{
                html += '<br><b> ' + dataFields[canRequestLoc+1] + '</b> <br> <br>';
              };
              html += '<b>Request System: </b>' + dataFields[siteLoc] + '<br>';
              if (dataFields[siteLoc]=='ECAPS'){
                html += '<b>ECAPS Classification: </b>' + dataFields[EClassLoc] + '<br>';
              };
              html += '<b>Type: </b>' + dataFields[typeLoc] + '<br>';
              html += '<b>Category: </b>' + dataFields[categoryLoc] + '<br>';

               html += '<b>Description: </b> ' ;

              for (var k=descripLoc; k<dataFields.length; k+=1){
                 html += dataFields[k];
              }

               html += '<br><br></div>';
              html += '</td> </tr>';

           }
           html += '</table>';
           $('.app').append(html);
       }        
    });
});
</script>

所以脚本完美地加载了所有信息，但部分

html += '<td class="demo-show"> <h3>' + dataFields[nameLoc] +  '</h3>';

class="demo-show" 应该将其链接到另一个脚本，在该脚本中，它使信息在隐藏之下。像手风琴一样。

脚本是（在文档的不同部分）：

$(document).ready(function() {
    $('td.demo-show > div').hide();  
    $('td.demo-show > h3').click(function() {
        $(this).next().slideToggle('fast');
    });
});

所有这些都在我的本地机器上工作，但是当我把它放在服务器上时，手风琴脚本不起作用，这很奇怪，因为在网站的另一部分使用完全相同的脚本并且它工作。

只有 JQuery Ajax 部分加载的部分不起作用。

我什么都试过了！！这是我第一次在论坛上发帖。请看看，让我知道你的想法。

更新：这里是网站。请在 IE 中尝试 http://jsolomon9.99k.org/

不起作用的部分是，当您单击“标题 1”时，它下面的信息也应该产生手风琴效果。相反，它只是静态的。

4

1 回答 1

0

我查看了您的源代码，这是您添加的 js 文件

<script src="files/jquery.js" type="text/javascript"></script>
<script src="files/more-show.js" type="text/javascript"></script>
<script type="text/javascript" src="files/jquery.min.js"></script>

您不应该添加两个 jquery 文件，而是删除files/jquery.js并移至files/jquery.min.js页面顶部。像这样然后尝试

<script type="text/javascript" src="files/jquery.min.js"></script>
<script src="files/more-show.js" type="text/javascript"></script>
于 2012-07-18T20:18:03.343 回答