자바 스크립트 함수가 외부 js 파일에서 호출되지 않습니다.

등록 버튼을 클릭하면 등록 양식을 여는 홈 페이지가 있습니다. 이 등록 단추를 클릭하면 다른 js 파일에서 양식을 열어야하는 함수가 호출되지 않습니다.자바 스크립트 함수가 외부 js 파일에서 호출되지 않습니다.

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <title>Naperville Central Assassins</title> 
    <link rel="stylesheet" href="Assets/Stylesheets/Global/Global.css" /> 
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script type="text/javascript" src="Assets/Javascript/Init.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      // On Register Click Open Modal 
      $('#Register-Action').bind('click', function(){ 
       // Open The Modal 
       modalOpen('Form-Register'); 
      }); 
     }); 
    </script> 
</head> 
<body> 
<div id="Wrapper"> 
    <header id="Header"> 
     <div class="Container"> 
      <a href="#" class="Header-Logo Left"></a> 
      <a href="#" class="Header-Link Left Selected">Home</a> 
      <a href="#" class="Header-Link Left">Rules</a> 
      <a href="#" class="Header-Link Left">Leaderboards</a> 
      <a href="#" id="Register-Action" class="Btn Btn-Danger Right">Register</a> 
     </div> 
    </header> 

    <main id="Main"> 
     <div class="Container"> 
      Welcome to Naperville Central Assassins 2014! 
     </div> 
    </main> 

    <div id="Form-Register" class="Modal"> 
     <div class="Modal-Container"> 
      <a href="#" class="Btn-Close Modal-Toggle"></a> 
      <div id="Modal-Register-Form"> 
       <h1>Register!</h1> 
       <form id="Register-Form" method="post" action="#"> 
        <fieldset> 
         <p> 
          <legend class="Form-Legend">First Name</legend> 
          <input type="text" name="fname" class="Form-Field" placeholder="First Name" /> 
         </p> 

         <p> 
          <legend class="Form-Legend">Last Name</legend> 
          <input type="text" name="lname" class="Form-Field" placeholder="Last Name" /> 
         </p> 

         <p> 
          <legend class="Form-Legend">E-Mail</legend> 
          <input type="text" name="email" class="Form-Field" placeholder="E-Mail" /> 
         </p> 

         <p> 
          <legend class="Form-Legend">Password</legend> 
          <input type="password" name="password" class="Form-Field" placeholder="Password" /> 
         </p> 

         <p> 
          <legend class="Form-Legend">Phone Number</legend> 
          <input type="text" name="pn" class="Form-Field" placeholder="Phone Number" /> 
         </p> 

         <p> 
          <legend class="Form-Legend">School ID</legend> 
          <input type="text" name="school_id" class="Form-Field" placeholder="School ID" /> 
         </p> 

         <p> 
          <input type="submit" name="submit" class="Btn Btn-Success Left" value="Register" /> 
          <button class="Btn Left Modal-Toggle">Cancel</button> 
         </p> 

         <div class="Clear"></div> 
        </fieldset> 
       </form> 
      </div> 
     </div> 
    </div> 
</div> 
</body> 
</html>

JS는 DOM 준비 처리기 외부로

$(document).ready(function(){ 
    // Check if Browser is Up To Date. 
    if(!("FormData" in window)){ 
     // Tell the user to use a better browser, or whatever 
     alert('Upgrade Your Browser! Some Objects May Not Work.'); 
    } 

    // Stop All Forms From Submitting 
    $('form').bind('submit', function(e){ 
     // Don't Do Anything on Form Submit 
     e.stopPropagation(); 
     e.preventDefault(); 
     return false; 
    }); 

    // Find Modal Div And Close On X Click 
    $('.Modal-Toggle').bind('click', function(){ 
     var divId = $(this).closest('.Modal').attr('id'); 
     modalClose(divId); 
    }); 

    // Function That Opens A Modal 
    function modalOpen(divId){ 
     $('#' + divId).fadeIn(); 
    } 

    // Function That Closes A Modal 
    function modalClose(divId){ 
     $('#' + divId).fadeOut(); 
    } 

    // Function That Sends AJAX Data To Server 
    function AJAXSend(Type, Page, Data){ 
     alert(Type); 
    } 
});

출처

2014-01-12 Moussa Harajli

문서 준비 문이 일 –

@DennisMartinez 감사의 외부에 넣어 그 외부 함수 내에서 액세스 할 수 있습니다! –

이동을 modalOpen() 같은 기능을 파일. 다른 함수 내에서 함수를 정의 할 때 정의 된 기능은

$(document).ready(function() { 
    // Check if Browser is Up To Date. 
    if (!("FormData" in window)) { 
     // Tell the user to use a better browser, or whatever 
     alert('Upgrade Your Browser! Some Objects May Not Work.'); 
    } 

    // Stop All Forms From Submitting 
    $('form').bind('submit', function (e) { 
     // Don't Do Anything on Form Submit 
     e.stopPropagation(); 
     e.preventDefault(); 
     return false; 
    }); 

    // Find Modal Div And Close On X Click 
    $('.Modal-Toggle').bind('click', function() { 
     var divId = $(this).closest('.Modal').attr('id'); 
     modalClose(divId); 
    }); 

}); 
// Function That Opens A Modal 
function modalOpen(divId) { 
    $('#' + divId).fadeIn(); 
} 

// Function That Closes A Modal 
function modalClose(divId) { 
    $('#' + divId).fadeOut(); 
} 

// Function That Sends AJAX Data To Server 
function AJAXSend(Type, Page, Data) { 
    alert(Type); 
}

출처

2014-01-12 03:26:54

Worked. 도와 주셔서 감사합니다! –

자바 스크립트 함수가 외부 js 파일에서 호출되지 않습니다.

답변

관련 문제