내 코드에서 오류를 찾을 수 없습니까?

간단한 검색 코드를 작성 중입니다. 오류를 찾을 수 없습니다. 오류 메시지에 Uncaught SyntaxError: Unexpected identifier on javascript line 40 (target=document.getElementById("outputPlace")이 표시됩니다.내 코드에서 오류를 찾을 수 없습니까?

버튼을 보지 말고 아직 이벤트 수신기를 추가하지 않았습니다. 그냥 입력하면 제품이 표시됩니다.

HTML 코드

<html> 
<head> 

<title>Price List </title> 

</head> 

<body> 

<h1> PRICELIST </h1> 
<form id="formSearch"> 
<div> 
<label for="searchBox"> Search products here: </label> 
<input type="text" placeholder="Type text here to search product" id="searchBox"> 
</div> 
<div id="buttons"> 
<button id="getAll"> GET ALL PRODUCTS</button> 
</div> 

</form> 

<div id="outputPlace"> 

</div> 


<script src="product.js"></script> 
</body> 


</html> 


JAVASCRIPT CODE 

(function(){     //start anonymous function 

var list= { 

    "listOfProducts": [ 

    { 
    "name":"hard disk", 
    "price": "50$", 
    "quality":"good", 
    }, 
    { 
    "name":"monitor", 
    "price":"100$", 
    "quality": "very good", 
    }, 
    { 
    "name":"speakers", 
    "price":"20$", 
    "quality": "not bad", 
    }, 
    { 
    "name":"headphones", 
    "price":"12$", 
    "quality":"bad", 
    }, 
    { 
    "name": "mobile phone", 
    "price": "300$", 
    "quality": "excellent", 
    }, 
    { 
    "name": "usb memory", 
    "price": "30$", 
    "quality": "the best", 
    } 
    ] 
}, 

var target=document.getElementById("outputPlace"), 
    searchForm=document.getElementById("formSearch"), 
    productList=list.listOfProducts, 
    listLength=productList.length, 
    searchValue=document.getElementById("searchBox"), 
    searchInput=searchValue.value; 




var listMethods = { 

searchList: function(event) { 

event.preventDefault(); 
var i; 
target.innerHTML=""; 
if(listLength>0 && searchInput!=="") { 

    for(i=0;i<listLength;i++) { 
    var product=productList[i], 
     whatIsFound=product.name.indexOf(searchInput); 
     if(whatIsFound!==-1){ 

     target.innerHTML+='<p>'+product.name+', '+product.price+', '+product.quality+'<a href="http//www.facebook.com">click here to buy</a></p>' 
     } 

    } 


} 





}, 





}; 

searchForm.addEventListener("submit",listMethods.searchList,false); 








})(); //end anonymous function

출처

2013-07-24 Nikola Lošić

후 스크립트의 끝 부분에 또 하나의 쉼표,}있다. .. – Neal

당신은 다른 VAR 다음에 당신이 당신의 자바 스크립트의 상단에 정의 된 대형 JSON 객체 후 쉼표를 보유하고 있습니다.

var list= { 
"listOfProducts": [ 
{ 
    "name":"hard disk", 
    "price": "50$", 
    "quality":"good", 
}, 
...[a bunch of stuff]... 
}, 

var target=document.getElementById("outputPlace"), 
    searchForm=document.getElementById("formSearch"), 
    productList=list.listOfProducts, 
    listLength=productList.length, 
    searchValue=document.getElementById("searchBox"), 
    searchInput=searchValue.value;

두 가지 다른 제안 된 답변으로 모두 문제를 해결할 수 있습니다 (물론 Okome는 두 번째 var를 삭제하는 답을 삭제했습니다).

출처

2013-07-24 20:51:47

나는 삭제하고 두었다; 나도 쉼표를 삭제했다.}하지만 코드는 여전히 작동하지 않습니다. –

다음은 HTML 및 JavaScript ("두 번째 var 제거"수정 적용)가있는 JSFiddle입니다. http://jsfiddle.net/49Rp9/ 더 이상의 스크립트 오류가 없습니다. , 그러나 그것이 작동하는 한, 그것은 다른 질문 인 것처럼 보입니다. –

변경이이

var list = { 
    ... 
}, 

var target=document.getElementById("outputPlace"),

var list = { 
... 
}; 

var target=document.getElementById("outputPlace"),

출처

2013-07-24 20:53:10 mikach

그리고 그것은 콘솔 당신에게 오류를 알려 주어야

출처

2013-07-24 20:56:34

내 코드에서 오류를 찾을 수 없습니까?

답변

관련 문제