2016-07-24 2 views
0

저는 실험으로 웹 사이트를 만드는 데 노트를 시작했습니다. 대괄호로 묶인 라이브 미리보기에서 정상적으로 작동했지만 파일을 저장 했으므로 이제는 jQuery가 작동하지 않습니다. 나는 그것이 저장되면 한 번 일어난 이후로 그것으로 괄호로 뭔가 될 수도 내 코드라고 생각합니다.jQuery in Brackets 실시간 미리보기가 작동하지 않습니다.

$(document).ready(function() { 
 

 
    var notes = []; 
 

 
    $("#newNoteWrapper").hide(); 
 

 
    $(".text").focus(function() { 
 

 
    $(this).stop 
 
    $(this).animate({ 
 
     marginLeft: "+=3%" 
 
    }); 
 

 
    }); 
 
    $(".text").blur(function() { 
 

 
    $(this).stop 
 
    $(this).animate({ 
 
     marginLeft: "-=3%" 
 
    }); 
 

 
    }); 
 

 
    $(".button").hover(function() { 
 

 
    $(this).stop(); 
 
    $(this).animate({ 
 
     backgroundColor: "#108cb1" 
 
    }, 200); 
 

 
    }, function() { 
 

 
    $(this).stop() 
 
    $(this).animate({ 
 
     backgroundColor: "#2DBEEB" 
 
    }, 200); 
 

 
    }); 
 

 
    $("#newNoteButton").click(function() { 
 

 
    newNote(true); 
 

 
    }); 
 

 

 
    $("#doneButton").click(function() { 
 

 
    newNote(false); 
 

 
    }); 
 
}); 
 

 
var newNote = function(enter) { 
 

 
    if enter { 
 
    $("#newNoteWrapper").show(); 
 
    } else { 
 
    $("#newNoteWrapper").hide(); 
 
    notes.push({ 
 
     title: $("#noteTitle").val(), 
 
     body: $("#noteBody").val(), 
 
    }); 
 
    } 
 
}
html, 
 
body { 
 
    padding: 0; 
 
    margin: 0; 
 
    border: 0; 
 
    background-color: #FFFFFF; 
 
    font-family: sans-serif; 
 
} 
 
.button { 
 
    padding: 15px 25px; 
 
    border: none; 
 
    font-size: 25px; 
 
    margin-bottom: 10px; 
 
    background-color: #2DBEEB; 
 
    color: #FFFFFF; 
 
    outline: none; 
 
} 
 
.text { 
 
    border: none; 
 
    outline: none; 
 
    width: 92%; 
 
    border-left: 10px solid #2DBEEB; 
 
    resize: vertical; 
 
    background-color: #FFFFFF; 
 
} 
 
#newNoteButton { 
 
    margin: 10px; 
 
} 
 
#newNoteWrapper { 
 
    z-index: 2; 
 
    position: absolute; 
 
    height: 100%; 
 
    width: 100%; 
 
    background-color: #FFFFFF; 
 
    top: 0%; 
 
} 
 
#newNote { 
 
    background-color: #2DBEEB; 
 
    color: #FFFFFF; 
 
    font-size: 30px; 
 
    padding: 10px; 
 
    text-align: center; 
 
} 
 
#noteTitle { 
 
    font-size: 25px; 
 
    height: 50px; 
 
    margin: 10px 0px 10px 0px; 
 
} 
 
#noteBody { 
 
    font-size: 12pt; 
 
    height: 500px; 
 
    margin: 0px 0px 10px 0px; 
 
} 
 
#doneButton { 
 
    left: 0; 
 
    position: absolute; 
 
    margin-left: 10px; 
 
}
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <link rel="stylesheet" type="text/css" href="notes.css"> 
 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
    <script src="//cdn.jsdelivr.net/jquery.color-animation/1/mainfile"></script> 
 
    <script src="notes.js"></script> 
 
    <title>Simple Notes</title> 
 
</head> 
 

 
<body> 
 

 
    <button id="newNoteButton" class="button">new note</button> 
 
    <div id="newNoteWrapper"> 
 
    <div id="newNote">new note</div> 
 
    <form> 
 
     <input type="text" id="noteTitle" class="text" placeholder="title..."></input> 
 
     <textarea id="noteBody" class="text" placeholder="body..."></textarea> 
 
     <br /> 
 
     <button id="doneButton" class="button">done</button> 
 
    </form> 
 

 
    </div> 
 

 
</body> 
 

 
</html>

이에 문제가 아니면 내가 다른 편집기를 시도해야합니다 : 여기 내 코드는?

+1

의 follwing을 편집해야합니다, 당신은 구문 오류가 있습니다 '하면하는 입력 { '또한 처음 두 개의'$ (this) .stop' 줄 뒤에'()'을 잊어 버렸습니다. –

답변

0

당신이 HTML에서 개발 도구의 콘솔에서

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script src="https://cdn.jsdelivr.net/jquery.color-animation/1/mainfile"></script> 

JS

에서
var newNote = function(enter) { 

    if (enter) { 
     $("#newNoteWrapper").show(); 
    } else { 
     $("#newNoteWrapper").hide(); 
     notes.push({ 
     title: $("#noteTitle").val(), 
     body: $("#noteBody").val(), 
     }); 
    } 
} 
+0

이 문제가 해결되어 여전히 작동하지 않습니다. 내가 $'(document) .ready (function() {'작동하지 않지만'안에''테스트 '')하면 안쪽에 있으면 – septicorn

+0

https : // jsfiddle .net/h0wc80w9/ –

+0

그래, 고마워, 뭔가 놓친 것 같아. / – septicorn

관련 문제