在不同的文件中使用Javascript獲取表單數據

Question

我有一個HTML文件和一個JavaScript文件來捕獲數據， 我試圖捕獲數據，但它不起作用，函數沒有運行。

這裏是我的代碼

HTML文件：

<form class="form-newsletter"> 
     <div class="form-group"> 
     <span><input type="text" name="name" value="" class="input-type" placeholder="Masukkan Email Anda"></span> 
     <input type="submit" class="btn btn-yellow" value="SUBMIT" onclick="newsletterFormFunctions()"/> 
     </div> 
</form> 

JS文件：

function newsletterFormFunctions() { 
NewsletterConfig.email = ''; 
NewsletterConfig.name = 'Test'; 
console.log('Enter Here'); 

$('form.form-newsletter input[type="submit"]').click(function (evt) { 
    validateForm(); 
}); 
function validateForm() { 
    $('form.form-newsletter input[type="submit"]').prop('disabled', true); 
    $('form.form-newsletter input[type="submit"]').val('LOADING'); 
    NewsletterConfig.email = $('form.form-newsletter input.input-type').val(); 
    } 
} 

Answer 1

你應該把該事件的 'newsletterFormFunctions' 功能外結合，說在文檔就緒事件處理程序中。

function newsletterFormFunctions() { 
 
    NewsletterConfig.email = ''; 
 
    NewsletterConfig.name = 'Test'; 
 
    console.log('Enter Here'); 
 
} 
 
$(document).ready(function() { 
 
    $('form.form-newsletter input[type="submit"]').click(function(evt) { 
 
    validateForm(); 
 
    }); 
 

 
    function validateForm() { 
 
    $('form.form-newsletter input[type="submit"]').prop('disabled', true); 
 
    $('form.form-newsletter input[type="submit"]').val('LOADING'); 
 
    NewsletterConfig.email = $('form.form-newsletter input.input-type').val(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form class="form-newsletter"> 
 
    <div class="form-group"> 
 
    <span><input type="text" name="name" value="" class="input-type" placeholder="Masukkan Email Anda"></span> 
 
    <input type="submit" class="btn btn-yellow" value="SUBMIT" onclick="newsletterFormFunctions()" /> 
 
    </div> 
 
</form>