Question

我已经详尽地浏览了互联网，以找到解决此问题的方法。
所以我有一个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”时，它下面的信息也会产生手风琴效果。相反，它只是静态的。

Answer 1

我看了你的来源，这里是你添加的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>

JQuery Ajax脚本在本地计算机上工作但不在服务器上工作

1 个答案: