2014-05-19 4 views
0

Chrome 패키지 앱에서 새롭고 두 가지 질문 (실제로 한 가지 문제가 해결됨)이 있습니다.Chrome 패키지 앱, 양식 제출 방법

Ajax 및 POST를 사용하여 원격 서버에 데이터를 보내려는 간단한 양식을 작성하려고합니다. 내가 이해하는 한, 인라인 자바 스크립트 (태그)를 사용할 수없고 또한 HTML 버튼 요소에서 이벤트를 사용할 수 없습니다. 그래서, 나는 어디에서 javascript를 넣을 것인지, 버튼을 클릭 할 때 무엇을 실행할 것인지 전혀 모른다. 내 양식은 다음과 같이 간단합니다.

<!DOCTYPE html> 
<html> 
    <head> 
    <script> 
     function send(){ 
     //do some ajax 
     } 
    </script> 
    </head> 
    <body> 
    <img id="headerImage" name="headerImage" src="logo_main.gif"/> 
    <div> 
     <form> 
     <table> 
      <tr> 
      <td>Send:</td> 
      <td><input type="text" size="32" id="send" name="send"/> 
      </tr> 
      <tr> 
      <td colspan="2"><button id="send">Send</button> 
      </tr> 
     </table> 
     </form> 
    </div> 
    </body> 
</html> 

내 두 가지 질문은 다음과 같습니다. 자바 스크립트는 어디에 두어야합니까? 내 HTML 단추 요소에서 javascript 함수를 실행하려면 어떻게해야합니까?

고맙습니다.

경찰서. 이것에 대한 완전한 문서를 검색했지만 찾지 못했습니다. 어떤 사람이 완전한 문서와 링크를하면 매우 감사 할 것입니다.

+0

이 문서의이 부분을 읽어 – Xan

답변

2

질문 제목이 실제로 질문에 해당하지 않습니다 (아마도 편집 하시겠습니까?). 질문에 답하기 :

내 두 가지 질문은 다음과 같습니다. 자바 스크립트는 어디에 두어야합니까? 어떻게하면 내 HTML 버튼 요소에서 자바 스크립트 기능을 실행할 수 있습니까?

이 두 가지 질문에 대한 답변은 documentation on Content Security Policy입니다. 자바 스크립트 코드는 <script> 태그와 함께 포함 된 별도의 파일로 이동해야하며 해당 코드 내에서 이벤트 리스너를 바인딩해야합니다.

이 답변을 올바르게 작성하려면 with jQuery (비 jQuery 솔루션의 경우 언급 된 문서 참조)을 사용하십시오. 사용하려면 jquery를 앱의 파일에서 "jquery.js"로 추가하십시오.

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="jquery.js"></script> 
    <script src="form.js"></script>  
    </head> 
    <body> 
    <!-- ... --> 
    <button id="send">Send</button> 
    <!-- ... --> 
    </body> 
</html> 

form.js : https://developer.chrome.com/extensions/contentSecurityPolicy#JSExecution (그것은 당신의 경우 확장을 위해,하지만 설명) :

function send(){ 
    //do some ajax 
} 

// Use document ready to wait for DOM to be created 
$(document).ready(function(){ 
    $('#send').click(send); // Binds a listener for onclick event 
}); 
관련 문제