A jQuery script is acting unpredictibly within WP environment.
-
I have a script, that on my dev server works beautifully (not in a WordPress environment) but not on our WordPress production machine. In fact it seems to register the updates when I u/l new files unless I toggle a plugin and u/l multiple times.
I put up a fresh install of the core files, that did clear some other errors I was seeing.
I can put the script into the browser’s console and it will work from there too. But just not from the file loaded by WordPress.
I resorted to using jQuery instead of $ shortcut. One suggestion was to enqueue jquery before head() and my custom script after head(); I do think this made things more stable.
I cannot for the life of me figure this out. Any ideas?
Here is the script in question:
//I have a few console.log for debug purposes, it will show that the //script is registered, and the script loaded, but it won’t detect the //change of fields. (but it will if I drop the script into the //browser console)
console.log(‘script registered’);
jQuery(document).ready(function(e) {
console.log(‘script_loaded’);
var phonePattern= /^(\(\d{3}\))|\d{3}-?(\d{3})?-?\d{4}$/;
var namePattern = /^[\w\s]+/;
var emailPattern = /^[\w\.\-\&\+]+@[\w\-\&\?]+.[A-Z]+/i;document.getElementById(“btnSubmit”).disabled = true;
jQuery(‘input[name=phone]’).change(function()
{ console.log (‘phone changed’);
gfphone= jQuery(‘input[name=phone]’).val();
console.log(gfphone);
if (!phonePattern.test(gfphone))
{
document.getElementById(“errorMesg”).innerHTML = “Please enter a phone number with format xxx-xxx-xxxx”;
document.getElementById(“btnSubmit”).disabled = true;
}
else
{
document.getElementById(“errorMesg”).innerHTML=””;
document.getElementById(“btnSubmit”).disabled = false;
}})
jQuery(‘input[name=email]’).change(function()
{
email = jQuery(‘input[name=email]’).val();
if (!emailPattern.test(email))
{
document.getElementById(“errorMesg”).innerHTML = “Please enter a valid email address”;
document.getElementById(“btnSubmit”).disabled = true;
}
else
{
document.getElementById(“errorMesg”).innerHTML =””;
document.getElementById(“btnSubmit”).disabled = false;
}})
jQuery(‘input[name=first_name]’).change(function()
{
first = jQuery(‘input[name=first_name]’).val();
if (!namePattern.test(first))
{
document.getElementById(“errorMesg”).innerHTML = “Please enter your name with no extra characters.”;
document.getElementById(“btnSubmit”).disabled = true;
}
else
{
document.getElementById(“errorMesg”).innerHTML =””;
document.getElementById(“btnSubmit”).disabled = false;
}
})
jQuery(‘input[name=first_name]’).change(function()
{
last = jQuery(‘input[name=last_name]’).val();
if (!namePattern.test(last))
{
document.getElementById(“errorMesg”).innerHTML = “Please enter your name with no extra characters.”;
document.getElementById(“btnSubmit”).disabled = true;
}
else
{
document.getElementById(“errorMesg”).innerHTML =””;
document.getElementById(“btnSubmit”).disabled = false;
}
})
})
- The topic ‘A jQuery script is acting unpredictibly within WP environment.’ is closed to new replies.