包含jQuery的JavaScript名稱空間

好吧，用逗號修正它！謝謝！我還有一個問題。我的jQuery似乎正在打破。其他一切正常。當我把jQuery放入我的SUBCAT中時，它會中斷。我很確定這是一個語法錯誤。這裏是jQuery的代碼。包含jQuery的JavaScript名稱空間

<!DOCTYPE html> 
    <html> 
    <head>  
     <meta charset="UTF-8"> 
     <title>For the love of cats and JavaScript</title> 
    </head> 
    <body> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
     <input id="filter" class="" name="filter" type="text" value="coffeePreference" onfocus="if (this.value == 'MYCATSPACE.SUBCAT.coffeePreference') {this.value = '';}" onblur="if (this.value == '') " /></br></br> 
     <input id="filter2" class="" name="filter2" type="text" value="breed" onfocus="if (this.value == 'breed') {this.value = '';}" onblur="if (this.value == '') " /></br></br> 
     <div id="catTable"></div> 
     <script> 

      var MYCATSPACE = MYCATSPACE || {}; 
      var sortCountry; 
      var sortBreed; 
      var sortCoffee; 

      $('input').keyup(function(e) { 
       var timeout; 
       clearTimeout(timeout); 
       timeout = setTimeout(function() { 
        criteria = this.value; 
        $.getJSON('cats.json', function(cats){MYCATSPACE.SUBCAT.filterCats(cats, criteria);}); 
       }.bind(this), 185); 
      }); 

      $("#filter2").keyup(function(e) { 
       var timeout; 
       clearTimeout(timeout); 
       timeout = setTimeout(function() { 
        criteria = this.value; 
        $.getJSON('cats.json', function(cats){MYCATSPACE.SUBCAT.filterCats2(cats, criteria);}); 
       }.bind(this), 185); 
      }); 
       MYCATSPACE.SUBCAT = { 


       renderData: function(cats){ 
        var output='<table id="indextable" border="1" cellpadding="10" cellspacing="0" style="border-collapse:collapse;">'; 
        output+="<thead>" 
        output+="<tr>"; 
        output+="<th> HeadShot </th>"; 
        output+="<th><button onclick='MYCATSPACE.SUBCAT.getSortedBreedData()'>Breed</button></th>"; 
        output+="<th><button onclick='MYCATSPACE.SUBCAT.getSortedCountryData()'>Country</button></th>"; 
        output+="<th><button onclick='MYCATSPACE.SUBCAT.getSortedCoffeeData()'>CoffeePreference</button></th>"; 
        output+="</tr>"; 
        output+="</thead>" 

        for (var i in cats) { 
         output+="<tbody>" 

         output+="<tr>"; 
         output+="<td><img src='" + cats[i].picture+"' alt='missing cat picture'></td>" 
         output+="<td>" + cats[i].breed + "</td>" 
         output+="<td>" + cats[i].country + "</td>" 
         output+="<td>" + cats[i].coffeePreference + "</td>" 
         output+="</tr>"; 
         output+="</tbody>" 

        } 
        output+="</table>"; 
        document.getElementById("catTable").innerHTML=output; 
       },  

       getData: function(){  
        $.getJSON('cats.json', function(cats) { 
         var cats = cats; 
         MYCATSPACE.SUBCAT.renderData(cats);  
        }); 
       }, 

       getSortedCountryData: function(){ 
        $.getJSON('cats.json', function(cats) { 
         var cats = cats; 
         if (sortCountry!=true) 
          MYCATSPACE.SUBCAT.sortData(cats,'country',1); 
         else 
          MYCATSPACE.SUBCAT.sortData(cats,'country',-1); 
          sortCountry ^= true; 
        }); 
       },    

       getSortedBreedData: function(){ 
        $.getJSON('cats.json', function(cats) { 
         var cats = cats; 
         if (sortCountry!=true) 
          MYCATSPACE.SUBCAT.sortData(cats,'breed',1); 
         else 
          MYCATSPACE.SUBCAT.sortData(cats,'breed',-1); 
          sortCountry ^= true; 
        }); 
       }, 

       getSortedCoffeeData: function(){ 
        $.getJSON('cats.json', function(cats) { 
         var cats = cats; 
         if (sortCountry!=true) 
          MYCATSPACE.SUBCAT.sortData(cats,'coffeePreference',1); 
         else 
          MYCATSPACE.SUBCAT.sortData(cats,'coffeePreference',-1); 
          sortCountry ^= true; 
        }); 
       }, 

       sortData: function(cats, element, direction){ 
        switch(element) { 
         case 'breed': 
         var sortedData = cats.sort(function(a,b){return (a.breed < b.breed) ? -1*direction : 1*direction;}); 
         MYCATSPACE.SUBCAT.renderData(cats); 
         break; 
         case 'country': 
         var sortedData = cats.sort(function(a,b){return (a.country < b.country) ? -1*direction : 1*direction;}); 
         MYCATSPACE.SUBCAT.renderData(cats); 
         break; 
         case 'coffeePreference': 
         var sortedData = cats.sort(function(a,b){return (a.coffeePreference < b.coffeePreference) ? -1*direction : 1*direction;}); 
         MYCATSPACE.SUBCAT.renderData(cats); 
         default: 
         MYCATSPACE.SUBCAT.renderData(cats); 
        } 

       }, 

       filterCats: function(cats, criteria){ 
        //var filteredData = cats.filter(function(c){return c.breed.toUpperCase().indexOf(criteria.toUpperCase()) !== -1;}); 
        var filteredData = cats.filter(function(c){return c.coffeePreference.toUpperCase().indexOf(criteria.toUpperCase()) === 0 ;});  
        MYCATSPACE.SUBCAT.renderData(cats); 
       }, 

       filterCats2: function(cats, criteria){ 
        //var filteredData = cats.filter(function(c){return c.breed.toUpperCase().indexOf(criteria.toUpperCase()) !== -1;}); 
        var filteredData = cats.filter(function(d){return d.breed.toUpperCase().indexOf(criteria.toUpperCase()) === 0 ;});  
        MYCATSPACE.SUBCAT.renderData(cats); 
       } 

      } 

      MYCATSPACE.SUBCAT.getData(); 

     </script> 
    </body> 
    </html>

來源

2015-08-21 00robinette

你錯過一個逗號在你的對象中。如果您顯示對象的準系統很明顯：

MYCATSPACE.SUBCAT = { 
    renderData: function(cats) { 
     // Code... 
    }, // <- Missing comma 

    getData: function() { 
     // Code... 
    } 
}

來源

2015-08-21 13:34:09 Stryner

嗨，謝謝！我還有一個關於將jQuery添加到名稱空間的問題。我修改了上面的代碼。 – 00robinette

@ 00robinette如果你還有其他問題，你應該把它作爲一個新問題發佈。 [修改現有的問題以提出不同的問題通常被認爲是不好的做法。]（http://meta.stackoverflow.com/questions/266767/what-is-the-the-best-way-to-ask-follow-問題）我會建議撤消你之前的編輯併發佈一個新問題。 – Stryner

啊。我道歉。 – 00robinette

你只有糾正缺少 ''，在下面的例子中，我escluded你的Ajax調用和按預期方式工作

var MYCATSPACE = MYCATSPACE || {}; 
 
       MYCATSPACE.SUBCAT = { 
 
       renderData: function (cats) { 
 
        
 
        var output='<table id="indextable" border="1" cellpadding="10" cellspacing="0" style="border-collapse:collapse;">'; 
 
        output+="<thead>" 
 
        output+="<tr>"; 
 
        output+="<th> HeadShot </th>"; 
 
        output+="<th><button onclick='getSortedBreedData()'>Breed</button></th>"; 
 
        output+="<th><button onclick='getSortedCountryData()'>Country</button></th>"; 
 
        output+="<th><button onclick='getSortedCoffeeData()'>CoffeePreference</button></th>"; 
 
        output+="</tr>"; 
 
        output+="</thead>" 
 

 
        for (var i in cats) { 
 
        output+="<tbody>" 
 

 
        output+="<tr>"; 
 
        output+="<td><img src='" + cats[i].picture+"' alt='missing cat picture'></td>" 
 
        output+="<td>" + cats[i].breed + "</td>" 
 
        output+="<td>" + cats[i].country + "</td>" 
 
        output+="<td>" + cats[i].coffeePreference + "</td>" 
 
        output+="</tr>"; 
 
        output+="</tbody>" 
 

 
        } 
 
        output+="</table>"; 
 
        document.getElementById("catTable").innerHTML=output; 
 
       }, // MISSING COMMA HERE 
 

 
       getData: function(){  
 
        //$.getJSON('cats.json', function(cats) { 
 
        // var cats = cats; 
 
        var cats = [{ picture: '', breed: 'apple', country: 'ITA', coffeePreference: 'pip' }]; 
 
        MYCATSPACE.SUBCAT.renderData(cats);  
 
        //} 
 
        //); 
 
       }, 
 

 

 
       } 
 

 
       MYCATSPACE.SUBCAT.getData();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="filter" class="" name="filter" type="text" value="coffeePreference" onfocus="if (this.value == 'coffeePreference') {this.value = '';}" onblur="if (this.value == '') " /></br></br> 
 
      <input id="filter2" class="" name="filter2" type="text" value="breed" onfocus="if (this.value == 'breed') {this.value = '';}" onblur="if (this.value == '') " /></br></br> 
 
<div id="catTable"></div>

來源

2015-08-21 13:33:58 InferOn

是不是有一個逗號太多的這段時間，在的getData結束？ – boisvert

@boisvert還有另一個逗號，但它不是錯誤 – InferOn

包含jQuery的JavaScript名稱空間

回答

相關問題