jQuery .Validate（）submitHandlerが動作しない

Question

フォームを作成しようとしていますが、ボタンを押したときに検証が成功すると、いくつかの機能を呼び出すとフォームデータを保存しますローカルストレージなど）。

問題は、関数を起動するsubmitHandlerを取得できないことです。ここに私が取り組んできたjsFiddleがあります。

http://jsfiddle.net/JamesKrawczyk/xdo9nn48/

とコード。 jQueryのセレクタで

<script> 
function fireifworked() 
{ 
$('.testIfWorking').html('IT WORKED'); 
} 

$(document).ready(function() { 
    $("#form1").validate({ 
     rules: { 
      field1: "required" 
     }, 
     messages: { 
      field1: "Please specify your name" 

     }, 
     submitHandler: function(form) { 
      fireifworked(); 
     } 
    }) 



    $('#btn').click(function() { 
     $("#form1").valid(); 
    }); 
}); 
</script> 

<form id="form1" name="form1"> 
    Field 1: <input name="field1" type="text" /> 
</form> 

<div> 
    <input id="btn" type="button" value="Validate"/> 
</div> 

<div class="testIfWorking"> 
CHANGE THIS IS WORKING 
</div> 

Answer 1

ボタンをクリックすると、提出するボタンの種類を変更することによって、あなたの運を試すことができ、フォームの内側にあることとbutton

<script> 
function fireifworked() 
{ 
$('.testIfWorking').html('IT WORKED'); 
} 

$(document).ready(function() { 
    $("#form1").validate({ 
     rules: { 
      field1: "required" 
     }, 
     messages: { 
      field1: "Please specify your name" 

     }, 
     submitHandler: function(form) { 
      fireifworked(); 
     } 
    }) 



    $('#btn').click(function() { 
     $("#form1").valid(); 
    }); 
}); 
</script> 

<form id="form1" name="form1"> 
    Field 1: <input name="field1" type="text" /> 
    <input id="btn" type="submit" value="Validate"/> 

</form> 




<div class="testIfWorking"> 
CHANGE THIS IS WORKING 
</div> 

Answer 2

.が欠落している、それは$('.testIfWorking').html('IT WORKED')

Answer 3

する必要がありますjqueryのがリンクされていないように思えます。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 

あなたのウェブサイト上でのjQueryを使用して起動するには、いくつかの方法があります：あなたのjqueryのコードが始まる前に

はヘッダにこれを追加します。次のことができます。

- ダウンロードGoogleのような例上記のようにCDNからjQuery.com

-IncludeのjQueryのjQueryライブラリ、。