Я изучаю jQuery самостоятельно и все еще работаю над собственным кодом для формы Mailchimp Opt-In. Я знаю, что есть и другие вопросы по этому поводу, которые я уже задавал, но я хочу понять, почему мой собственный код не работает как ученик jQuery. Я не хочу копировать чужой код, я просто хочу, чтобы мой код работал.
Я уже поставил post-json? U = и & c =? в действии. Итак, это мой HTML-код: (просто посмотрите на div с комментариями)
<div id="mc_embed_signup">
<form action="https://xxxxxxxxxx.com/subscribe/post-json?u=xxxxxx;id=xxxxx&c=?" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<div id="colonna-sx">
<div class="mc-field-group gruppo-email">
<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
<!-- THIS ONE -->
<div id="obbligo-email" class="obbligo-form" style="color:red">Campo obbligatorio</div>
</div>
<div class="mc-field-group gruppo-nome">
<input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
<!-- THIS ONE -->
<div id="obbligo-nome" class="obbligo-form" style="color:red">Campo obbligatorio</div>
</div>
<div class="clear"></div>
<div class="mc-field-group input-group gruppo-consenso">
<input type="radio" value="Acconsento al trattamento dei miei dati personali." name="CONSENSO" id="mce-CONSENSO-0"><label for="mce-CONSENSO-0">Acconsento al trattamento dei miei dati personali.</label>
<!-- THIS ONE -->
<div id="obbligo-consenso" class="obbligo-form" style="color:red">Campo obbligatorio</div>
</div>
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_6a6f3b7082472f64c07c2cad3_e065e0e3c4" tabindex="-1" value="">
</div>
</div>
<div id="colonna-dx">
<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="mc-button"></div>
</div>
<div class="clear"></div>
</div>
</form>
</div>
Как вы можете видеть, у меня есть несколько "div" с комментарием "THIS ONE" и ids # obbligo-email, # obbligo-nome и # obbligo-consenso, с "display: none" в моем файле css . Поэтому я хочу, чтобы эти 3 сообщения об ошибках появлялись или исчезали, если поля ввода пустые или нет.
Итак, это мой код jQuery
(function($) {
var $form = $("#mc-embedded-subscribe-form");
var stato1;
var stato2;
var stato3;
$("#mc-embedded-subscribe").bind("click", function(event){
if (event) event.preventDefault();
if ($("#mce-EMAIL").val()!=""){
$("#obbligo-email").css({"display":"none"});
stato1=true;
} else {
$("#obbligo-email").css({"display":"block"});
stato1=false;
},
if ($("#mce-FNAME").val()!=""){
$("#obbligo-nome").css({"display":"none"});
stato2=true;
} else {
$("#obbligo-nome").css({"display":"block"});
stato2=false;
},
if ($("#mce-CONSENSO-0").is("=checked")){
$("#obbligo-consenso").css({"display":"none"});
stato3=true;
} else {
$("#obbligo-consenso").css({"display":"block"});
stato3=false;
},
if (stato1==true && stato2==true && stato3==true) {
register($form);
}
});
function register($form) {
$.ajax({
type: $form.attr('method'),
url: $form.attr('action'),
data: $form.serialize(),
cache: false,
dataType: 'json',
contentType: 'application/json; charset=utf-8',
})
};
}(jQuery));
Я пытался понять другие ответы, отправленные на StackOverFlow с помощьюрезультатов нет, поэтому я здесь, чтобы посмотреть, сможет ли кто-нибудь помочь мне понять, что я делаю неправильно.
По-моему, я хочу, чтобы 3 сообщения об ошибках отображались, когда поля ввода пусты, и3 булевы переменные будут истинными, если все в порядке.
Если 3 булевы переменные истинны, отправьте форму с помощью Ajax, и я не хочу перезагружать страницу, просто очистите поля ввода.
Некоторая информация, которую я не понимаю:
PS: Если я изменю «method» на «get», у меня появится страница с ошибкой 404.
PSS: Если я использую "$ (document) .ready (funtion () {", то файл javascript не работает (я пытался узнать об этом, но не знаю почему).