我正在尝试我的第一个 jQuery 函数。需要发生的是将表单分配给该功能。当用户单击提交按钮时,它需要首先对函数中的每个 :input 字段进行验证。
我正在分配一个表单作为我的函数的选择器:
$("form[name='form_name']").validator();
然后将其传递给函数并分配给名为“selected_form”的函数属性。在我的 jQuery 函数中,我有另一个函数需要等待提交按钮被单击,然后它需要遍历所有 :input 表单元素并处理简单的验证。
现在的问题是:
a)在我的 jQuery 函数中,我正在调用return validate();
Validate 然后检查按钮是否被单击。我怀疑由于该函数已运行并且没有单击任何按钮,它会继续并基本上将 validate() 函数返回为 false 而不进行任何检查。我想我需要自定义它以几乎等到按下按钮,但我真的不知道该怎么做。
b)$(selected_form+" :input").each(function() { ... }
不起作用,因为它似乎无法将其用作选定对象。我需要遍历“selected_form”属性并仅选择 :input 字段。有什么帮助吗?
c)如果您对构建适当的 jQuery 函数有任何其他建议或最佳实践,请提供帮助,这是我的第一次尝试,我宁愿现在学习最佳实践,以遵循我自己的想法。
(function($) {
$.fn.validator = function(user_options) {
var default_options = {
exclusions: false,
rules: false,
submit_btn_name: 'event_form_submit'
};
var selected_form = this;
var selected_element = false;
var element_type = false;
var options = $.extend(default_options,user_options);
function validate() {
// Run only if form has been submitted: (this does not appear to work now, the form gets submitted without the return false;
$("input[type='"+options.submit_name+"']").click(function(event) {
event.preventDefault();
// The selector here appears to be wrong?
$(selected_form+" :input").each(function() {
// Individual element validation will happen here, for now I am just looking to log the element types :)
selected_element = this;
console.log(get_element_type());
});
return false;
});
return false;
};
function get_element_type() {
return element_type = element.type;
}
return validate();
}
})(jQuery);
// Run the validator:
$(document).ready(function() {
$("form[name='tepg_form_processor']").validator();
});