While using jquery or javascript code most of the time i have to face the problem of jquery or javascript conflict.
Still i haven't got the reason why this stuff get conflict with other code?
Any one have any idea about this?
And any solution so that next time this issue will not occur while project development.
I have one solution to stop the conflict of jquery files that is,
<script>
var j$=jQuery.noConflict();
</script>
but all the time this code is not working.
If you are using another JavaScript library that uses the $ variable, you can run into conflicts with jQuery. In order to avoid these conflicts, you need to put jQuery in no-conflict mode immediately after it is loaded onto the page and before you attempt to use jQuery in your page.
When you put jQuery into no-conflict mode, you have the option of assigning a variable name to replace $. ( only once )
<script src="prototype.js"></script>
<script src="jquery.js"></script>
<script>var $j = jQuery.noConflict();</script>
You can continue to use the standard $ by wrapping your code in a self-executing anonymous function; this is a standard pattern for plugin authoring, where the author cannot know whether another library will have taken over the $.
<script src="jquery.js"></script>
<script>
jQuery.noConflict();
(function($) {
// your code here, using the $
})(jQuery);
</script>
use jQuery instead of $
there few other ways to do so
reference
For jQuery, it's explained in noConflict's API page; basically, many JS frameworks use $ as a function name, and so they may conflict if more than one is used. Which it shouldn't anyway.
Try placing this in your header:
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"> </script>
Try to give an alert when DOM is ready and find it alerts or not if not there is a conflict
<script>
$(document).ready(function () {
alert("Hello!");
});
</script>
I there is conflict try this:
<script type="text/javascript" src="other_lib.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$.noConflict();
jQuery(document).ready(function($) {
// Code that uses jQuery's $ can follow here.
});
// Code that uses other library's $ can follow here.
</script>
noConflict()is for jQuery to get along with other possible libraries that make use of$variable (for example Prototype is such library). So if you often work with two conflicting libraries on one page, you have to get used to usingjQuery.noConflict.jQuery.noConflicts(), may b in header.jQuery.noConflictonce somewhere after embedding jQuery into to page, and then, instead of dollar sign variable ($) refer to jQuery by using variable you have assigned it to (j$in your example).