0
我使用的是jquery validation插件，除了我的多步表單的第一頁（用重力表單 - wordpress創建）之外，它沒有任何工作。Jquery驗證沒有在多步驟表單中工作
以前有沒有人見過類似的東西？
我的URL：http://breakingcapital.com/registration/
下面是使用JS代碼IM：
jQuery(document).ready(function($) {
$(document).ready(function(){
$('#gform_1').validate(
{
rules: {
input_18: {
minlength: 2,
required: true
},
lastname: {
minlength: 2,
required: true
},
email: {
required: true,
email: true
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: "#password"
},
message: {
minlength: 2,
required: true
},
text: {
minlength: 5,
required: true
}
},
highlight: function(element) {
$(element).closest('.gfield').removeClass('success').addClass('error1');
},
success: function(element) {
element
.text('OK!').addClass('valid')
.closest('.gfield').removeClass('error1').addClass('success');
}
})
});
});
下面是窗體的代碼：
<form method="post" enctype="multipart/form-data" target="gform_ajax_frame_1" id="gform_1" action="/registration/#gf_1">
<div class="gform_heading">
<h3 class="gform_title">testt</h3>
<span class="gform_description">Test</span>
</div>
<div id="gf_progressbar_wrapper_1" class="gf_progressbar_wrapper">
<h3 class="gf_progressbar_title">Step 2 of 4
</h3>
<div class="gf_progressbar">
<div class="gf_progressbar_percentage percentbar_blue percentbar_50" style="width:50%;"><span>50%</span></div>
</div></div>
<div class="gform_body"><div id="gform_page_1_1" class="gform_page" style="display:none;">
<div class="gform_page_fields">
<ul id="gform_fields_1" class="gform_fields top_label description_below"><li id="field_1_2" class="gfield required gfield_contains_required"><label class="gfield_label" for="input_1_2">Email<span class="gfield_required">*</span></label><div class="ginput_container"><input name="input_2" id="input_1_2" type="email" value="[email protected]" class="medium" tabindex="1"></div></li><li id="field_1_5" class="gfield required gfield_contains_required"><label class="gfield_label" for="input_1_5">Password<span class="gfield_required">*</span></label><div class="ginput_complex ginput_container" id="input_1_5_container"><span id="input_1_5_1_container" class="ginput_left"><input type="password" name="input_5" id="input_1_5" value="test" tabindex="2"><label for="input_1_5">Enter Password</label></span><span id="input_1_5_2_container" class="ginput_right"><input type="password" name="input_5_2" id="input_1_5_2" value="test" tabindex="3"><label for="input_1_5_2">Confirm Password</label></span><div class="gf_clear gf_clear_complex"></div></div></li></ul>
</div>
<div class="gform_page_footer">
<input type="button" id="gform_next_button_1_12" class="button gform_next_button" value="Next" tabindex="4" onclick="jQuery("#gform_target_page_number_1").val("2"); jQuery("#gform_1").trigger("submit",[true]); ">
</div>
</div>
<div id="gform_page_1_2" class="gform_page">
<div class="gform_page_fields">
<ul class="gform_fields top_label"><li id="field_1_18" class="gfield firstname gfield_contains_required"><label class="gfield_label" for="input_1_18">First Name<span class="gfield_required">*</span></label><div class="ginput_container"><input name="input_18" id="input_1_18" type="text" value="" class="medium" tabindex="5"></div></li><li id="field_1_17" class="gfield gfield_contains_required"><label class="gfield_label" for="input_1_17">Last Name<span class="gfield_required">*</span></label><div class="ginput_container"><input name="input_17" id="input_1_17" type="text" value="" class="medium" tabindex="6"></div></li><li id="field_1_3" class="gfield gfield_contains_required"><label class="gfield_label" for="input_1_3">Phone<span class="gfield_required">*</span></label><div class="ginput_container"><input name="input_3" id="input_1_3" type="tel" value="" class="medium" tabindex="7"></div></li><li id="field_1_6" class="gfield gfield_contains_required"><label class="gfield_label" for="input_1_6">Upload your picture<span class="gfield_required">*</span></label><div class="ginput_container"><input name="input_6" id="input_1_6" type="file" value="" size="20" class="medium" tabindex="8"></div></li></ul>
</div>
<div class="gform_page_footer">
<input type="button" id="gform_previous_button_1_13" class="button gform_previous_button" value="Previous" tabindex="10" onclick="jQuery("#gform_target_page_number_1").val("1"); jQuery("#gform_1").trigger("submit",[true]); "> <input type="button" id="gform_next_button_1_13" class="button gform_next_button" value="Next" tabindex="9" onclick="jQuery("#gform_target_page_number_1").val("3"); jQuery("#gform_1").trigger("submit",[true]); ">
</div>
</div>
<div id="gform_page_1_3" class="gform_page" style="display:none;">
<div class="gform_page_fields">
<ul class="gform_fields top_label"><li id="field_1_4" class="gfield"><label class="gfield_label" for="input_1_4">Website</label><div class="ginput_container"><input name="input_4" id="input_1_4" type="url" value="" class="medium" tabindex="11" placeholder="http://"></div><div class="gfield_description">Want us to link to your website?</div></li><li id="field_1_8" class="gfield gfield_contains_required"><label class="gfield_label" for="input_1_8">Google +<span class="gfield_required">*</span></label><div class="ginput_container"><input name="input_8" id="input_1_8" type="text" value="" class="medium" tabindex="12"></div><div class="gfield_description">This is required for google authorship. Read more here:</div></li><li id="field_1_9" class="gfield"><label class="gfield_label" for="input_1_9">Twitter</label><div class="ginput_container"><input name="input_9" id="input_1_9" type="text" value="" class="medium" tabindex="13"></div></li><li id="field_1_10" class="gfield"><label class="gfield_label" for="input_1_10">Facebook</label><div class="ginput_container"><input name="input_10" id="input_1_10" type="text" value="" class="medium" tabindex="14"></div></li><li id="field_1_11" class="gfield"><label class="gfield_label" for="input_1_11">Linkedin</label><div class="ginput_container"><input name="input_11" id="input_1_11" type="text" value="" class="medium" tabindex="15"></div></li></ul>
</div>
<div class="gform_page_footer">
<input type="button" id="gform_previous_button_1_16" class="button gform_previous_button" value="Previous" tabindex="17" onclick="jQuery("#gform_target_page_number_1").val("2"); jQuery("#gform_1").trigger("submit",[true]); "> <input type="button" id="gform_next_button_1_16" class="button gform_next_button" value="Next" tabindex="16" onclick="jQuery("#gform_target_page_number_1").val("4"); jQuery("#gform_1").trigger("submit",[true]); ">
</div>
</div>
<div id="gform_page_1_4" class="gform_page" style="display:none;">
<div class="gform_page_fields">
<ul class="gform_fields top_label"><li id="field_1_14" class="gfield gfield_contains_required"><label class="gfield_label" for="input_1_14">Long Bio<span class="gfield_required">*</span></label><div class="ginput_container"><textarea name="input_14" id="input_1_14" class="textarea medium" tabindex="18" rows="10" cols="50"></textarea></div><div class="gfield_description">This is for your profile page. Generally 100-300 words works best. </div></li><li id="field_1_15" class="gfield gfield_contains_required"><label class="gfield_label" for="input_1_15">Short bio<span class="gfield_required">*</span></label><div class="ginput_container"><textarea name="input_15" id="input_1_15" class="textarea medium" tabindex="19" rows="10" cols="50"></textarea><div class="charleft ginput_counter">0 of 500 max characters</div></div><div class="gfield_description">This is displayed on each and every article you write. </div></li>
</ul></div>
<div class="gform_page_footer top_label"><input type="button" id="gform_previous_button_1" class="button gform_previous_button" value="Previous" tabindex="20" onclick="jQuery("#gform_target_page_number_1").val("1"); jQuery("#gform_1").trigger("submit",[true]); "> <input type="submit" id="gform_submit_button_1" class="button gform_button" value="Submit" tabindex="21" onclick="if(window["gf_submitting_1"]){return false;} if(!jQuery("#gform_1")[0].checkValidity || jQuery("#gform_1")[0].checkValidity()){window["gf_submitting_1"]=true;} "><input type="hidden" name="gform_ajax" value="form_id=1&title=1&description=1">
<input type="hidden" class="gform_hidden" name="is_submit_1" value="1">
<input type="hidden" class="gform_hidden" name="gform_submit" value="1">
<input type="hidden" class="gform_hidden" name="gform_unique_id" value="525883d3eb548">
<input type="hidden" class="gform_hidden" name="state_1" value="WyJhOjA6e30iLCI0OTY4NTBiMzg4ZDg1NTYxYmIwMzVkNDgwYTRhYTA2MyJd">
<input type="hidden" class="gform_hidden" name="gform_target_page_number_1" id="gform_target_page_number_1" value="3">
<input type="hidden" class="gform_hidden" name="gform_source_page_number_1" id="gform_source_page_number_1" value="2">
<input type="hidden" name="gform_field_values" value="">
</div>
</div></div>
</form>
我們是否可以從控制檯收到錯誤消息。 ？！ –
沒有一個..我添加了網址的說明..謝謝！ – js111
唯一的驗證工作是電子郵件字段..我通過將電子郵件字段移動到第二步然後停止工作來測試此項。 – js111