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>