2017-07-30 64 views
0

我正在做一些AJAX表單提交測試,我一直從下面的代碼獲得ReferenceError: submit_ajax is not defined。但是,您可以看到它已被定義。Javascript函數未定義,但它是IS

<script type="javascript"> 
function submit_ajax(){ 
    data = {'email':$('#email2').val(),'password':$('#pwd2').val()} 

    $.ajax({ 
     url: 'ajax_testing.php', 
     data: data, 
     success: function() { 
      //AJAX success 
      $('#success_fail').html('success!'); 
      window.setTimeout(function() { $('#success_fail').hide(); }, 3000); 
      $('#myModal2').hide(); 
     }, 
     error: function() { 
      //Ajax failure 
      $('#success_fail').html('failed!'); 
      window.setTimeout(function() { $('#success_fail').hide(); }, 3000); 
      $('#myModal2').hide(); 
     } 
    }); 
} 

</script> 


    <div> 
     <div id="success_fail"></div> 
     <!-- Trigger the modal with a button --> 
     <button type="button" class="btn btn-info btn-lg" id="button_for_modal2" data-toggle="modal" data-target="#myModal2">Form Submitted via AJAX and No Parent Refresh</button> 

     <!-- Modal --> 
     <div class="modal fade" id="myModal2" role="dialog"> 
     <div class="modal-dialog"> 

      <!-- Modal content--> 
      <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <h4 class="modal-title">Title of Form</h4> 
      </div> 
      <div class="modal-body"> 
       <h2>Vertical (basic) form</h2> 
       <!--<form action="<?PHP echo $_SERVER['PHP_SELF']; ?>" method="post">*******************************AJAX*********************************--> 
       <div class="form-group"> 
        <label for="email">Email:</label> 
        <input type="email" class="form-control" id="email2" placeholder="Enter email (ajax)" name="email2"> 
       </div> 
       <div class="form-group"> 
        <label for="pwd">Password:</label> 
        <input type="password" class="form-control" id="pwd2" placeholder="Enter password (ajax)" name="pwd2"> 
       </div> 
       <button onclick="submit_ajax()" class="btn btn-default">Submit</button> 
       <!--</form>--> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      </div> 
      </div> 
     </div> 
     </div> 
    </div> 

我試着直接在控制檯中運行該功能,我得到了同樣的東西。

有關這裏發生了什麼問題的任何想法?

+2

的問題是與屬性'型= 「JavaScript的」' - 沒有一個公認的JavaScript MIME類型 –

+0

請參閱:https://stackoverflow.com/a/4195504/6836839 – btzr

回答

2

而不是使用<script type="javascript">使用<script type="text/javascript">這是JS代碼的有效類型。

+4

或者根本不使用任何類型,因爲text/javascript是默認的 – baao

0

改變你的腳本標籤,要麼不包括type,或設置爲type="text/javascript"

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
    <script type="text/javascript"> 
 
    function submit_ajax(){ 
 
     alert('submit_ajax working') 
 
     data = {'email':$('#email2').val(),'password':$('#pwd2').val()} 
 

 
     $.ajax({ 
 
      url: 'ajax_testing.php', 
 
      data: data, 
 
      success: function() { 
 
       //AJAX success 
 
       $('#success_fail').html('success!'); 
 
       window.setTimeout(function() { $('#success_fail').hide(); }, 3000); 
 
       $('#myModal2').hide(); 
 
      }, 
 
      error: function() { 
 
       //Ajax failure 
 
       $('#success_fail').html('failed!'); 
 
       window.setTimeout(function() { $('#success_fail').hide(); }, 3000); 
 
       $('#myModal2').hide(); 
 
      } 
 
     }); 
 
    } 
 

 
    </script> 
 
    <button onclick="submit_ajax()" class="btn btn-default">Submit</button>

+0

請添加一些解釋。 – Bergi

+0

對不起,它進入腳本標記。現在它可見。謝謝 –