How to avoid conflicts in jquery libraries?

Navigation
2

Good, I'll try to explain then I'm newbie . I need to use a new library, and

This code works perfectly when alone with this example: 

< script src="//code.jquery.com/jquery-1.10.2.js">< /script >
<script>
  meu codigo
< /script >

But if I need to add more "jquersxxx.js" all page java stops running, and in the "inspector console" I can see all sorts of errors like 

form:699 Uncaught TypeError: $(...).minicolors is not a function
common-scripts.js?1455274914:87 Uncaught TypeError: $(...).niceScroll is not a function
sparkline-chart.js?1449132462:21 Uncaught TypeError: $(...).sparkline is not a function

Then searching on google friend, I found the following option: 

< script src="//code.jquery.com/jquery-1.10.2.js" >
jQuery.noConflict(); 

meu código

< /script >

But the error continues, all page java simply stops working the same way ... I just do not know how to use this feature

Please can someone please show me how to avoid / adjust this? the examples of the net are always theoretical ... I've been looking for this for 3 days ...

obs: Examples of how to use are always welcome!

    
asked by anonymous 20.05.2016 / 01:55

2 answers

2

If you look at .noConflict() documentation you will see that it serves only to avoid conflict with other libs that use the $ symbol.

In your case, I believe the problem is in the tag script. Script tags with the src attribute should be empty, so remove the code from inside it and put in another tag, like this: 

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script>
   // seu código aqui 
</script>
    
20.05.2016 / 03:07
1

Put your JQuery code inside a wrapper JQuery:

They can be as follows: 

jQuery(document).ready(function( $ ) {
    // Código JQuery aqui
});

Or: 

jQuery.noConflict();
 
(function( $ ) {
    //Codigo JQuery aqui
})( jQuery );

My favorite is: 

$(function(){
    //Codigo JQuery aqui
});

Remember that the symbol $ ( syntactic sugar a>) is a shortcut to a JQuery() object.

Example: 

<!DOCTYPE html>
<html>
    <head>
        <title>JQuery Teste</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script><script>$(function(){varresultado=$('#selectoption:selected').text();alert(resultado);});</script></head><body><selectid="select">
            <option selected>Olá, mundo!!!</option>
        </select>
    </body>
</html>
    
20.05.2016 / 02:05
___ ___ erkimt Show error message when entering phone ______ qstntxt ___

I have a form and I need this field

%pre%

In case it is the phone, it will display the following error messages: If the user types less than 8 digits, an error message appears, a %code% .

If the user types "-" which is an invalid character, an alert with = %code%

And if the number is valid (8 digits) nothing appears.

My code:

%pre%

It's not working.

The reference in the HTML to the javascript has to be by onKeyup if possible, as the javascript has to check after the user types.

Sincerely,

Gabriel

    
______ azszpr127718 ___

I suggest using the validation supported by the browser itself. This only works if the browser supports HTML5

%pre%

To use something more complete or different you can continue to use the onchange event with this automatic validation:

%pre%
    
______ azszpr127721 ___

You can do this:

%pre% %pre%

Remembering that it is more practical to limit size by html using maxLength, and using onblur prevents it from showing the message at all times when typing.

    
______ azszpr127729 ___

To complement, I'll leave a more complete version of @GabrielRodrigues' answer.

I made using the jQuery Mask Plugin , I believe it increases the usability of the field since it already comes formatted, in addition it it also "prohibits" any letters or any non-digit characters from being typed.

%pre% %pre%
    
______ azszpr127738 ___

I got it! I used the answer from @Bruno Costa and Js from @Gabriel Rodrigues. It just looks like this:

%pre%     
___ Script language for JVM and DVM