2種類のフォームがある1ページがあります。上部にタイプAの単一のフォームがあり、その下にタイプBのフォームが1つ以上あります。
Module pattern + jQueryを使用して、フォーム上のすべてのイベントを接続し、検証、ajax呼び出しなどを処理します。
これは、フォームAのようにシングルトンを定義し、フォームBのように再利用可能なオブジェクトクラスを定義するための好ましい/有効な方法ですか?prototype
それらは非常に似ており、オブジェクト、プロパティ、、new
または別のパターンを使用する必要があるかどうかはわかりません。すべてがうまくいくようですが、いくつかの重要なエラーが見当たらないのではないかと思います。
Form A
javascriptは次のようになります。
var MyProject.FormA = (function() {
var $_userEntry;
var $_domElementId;
var validate = function() {
if($_userEntry == 0) {
alert('Cannot enter 0!');
}
}
var processUserInput = function() {
$_userEntry = jQuery('inputfield', $_domElementId).val();
validate();
}
return {
initialize: function(domElementId) {
$_domElementId = domElementId;
jQuery($_domElementId).click(function() {
processUserInput();
}
}
}
})();
jQuery(document).ready(function() {
MyProject.FormA.initialize('#form-a');
});
Form B
、は1回または複数回初期化され、次のように定義されます。
var MyProject.FormB = function() {
var $_userEntry;
var $_domElement;
var validate = function() {
if($_userEntry == 0) {
alert('Cannot enter 0!');
}
}
var processUserInput = function() {
$_userEntry = jQuery('inputfield', $_domElement).val();
validate();
}
return {
initialize: function(domElement) {
$_domElement = domElement;
jQuery($_domElement).click(function() {
processUserInput();
}
}
}
};
jQuery(document).ready(function() {
jQuery(".form-b").each(function() {
MyProject.FormB().initialize(this);
});
});