onChange texfield javascript

Asked

Viewed 147 times

0

have a textfield with a id and I want the moment I finish writing to perform an action onChange javascript. 

<input type='text' id='idNewClient' />

Part of the JS

$("idNewClient").change(function() {
    console.log("teste");
});

I always have a mistake "change is not a Function".

javascript

  • The fact that the "#" is missing from the selector should not be the cause of the cited error. At most the event would not be triggered. Try using $("#idNewClient").on("change", function() {

  • If the above suggestion shows the error "on is not a Function", then the problem is another.

  • 1

    is sure that the jquery is loaded? if open the Developer tools and type for example $('teste') what appears?

  • @Ricardopunctual I believe that if jQuery wasn’t loading it would make the mistake "$ is not defined"

  • extly @sam, just to confirm if there is an error on the page, can be up to another script, just to remove the doubt

  • To make sure that the jQuery is loaded just check if $.fn.jquery returns the jQuery version. If it returns everything is OK, otherwise it is because jQuery has not been loaded or overwritten.

Show 1 more comment

2 answers

2

Your jQuery selector is wrong. A "#" is missing before the input ID.

With the following code it will work.

$("#idNewClient").change(function() {
    console.log("teste");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type='text' id='idNewClient'/>

0

If the returned object does not have the method change means that this object is not a jQuery object.

To check if the variable $ is really the jQuery you can check the content of $.fn.jquery.

If you print a string like "1.12.4" it is because $ is jQuery and the string represents the version. But this is not your case, because if it were, the error quoted in the question would not occur.

Okay, we found out that $ is not jQuery, the next step is to find out if jQuery was actually loaded. For that check the content of window.jQuery. If it is undefined it is very likely that jQuery was not loaded with the page.

The only exception would be if there were any jQuery.noConflict() in your code. Example:

// window.$ não é modificado. Apenas window.jQuery contém a lib
jQuery.noConflict();

// window.$ e window.jQuery não são modificados. Apenas window.jimCarrey contém a lib
let jimCarrey = jQuery.noConflict(true);

So after understanding the above concepts step by step to discover would:

>> $.fn.jquery
"1.12.4"     // OK
>> $.fn.jquery
ReferenceError: $.fn is undefined  // $ não é jQuery

>> jQuery.fn.jquery
"1.12.4"     // OK, apenas $ não é jQuery
>> jQuery.fn.jquery
ReferenceError: jQuery is not defined  // jQuery não carregado
>> jQuery.fn.jquery
ReferenceError: jQuery.fn is undefined  // jQuery foi sobrescrito

If the above tests fail, give a Ctrl + F and search for jQuery.noConflict in your code. If not find is because it is not loaded.

Curiosity

If jQuery is not loaded as $('body') returns an HTML element correctly when running in the browser console?!?!

Some modern browsers (such as Firefox, the Chrome and the Edge) use the $ as a alias for document.querySelector() and $$ as alias for document.querySelectorAll() where these are not used by the page loaded.

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.