I include the following in my header
<!-- scripts -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script type="text/javascript" src="./js/script.js"></script>
<script type="text/javascript" src="./js/jquery.infinitecarousel.js"></script>
<script type="text/javascript" src="./js/news.ticker.js"></script>
<script type="text/javascript" src="./js/jquery.autogrowtextarea.js"></script>
but the autogrowtextarea dont work if the script.js,jquery.infinitecarousel.js and news.ticker.js are included, but if i remove those three lines my autogrow textbox function work, why can this be. thanks
That means that something in one or all of those scripts is masking or breaking the functionality, or something on which it depends. Try not including the scripts one by one; isolate which one causes the break. Then look for duplicate definitions. Also, make sure that the scripts are included in the right order if there are any dependencies.
Try to put <script type="text/javascript" src="./js/jquery.autogrowtextarea.js"></script> next to the include of jquery and before the other ones and test if works. Maybe you have dependencies in the other files (script.js)
Related
I'm trying to add this library to my project: https://github.com/DragonBones/DragonBonesJS/tree/master/Phaser/Demos
I use webpack for merging all libraries, it produces such output in index.html:
<script type="text/javascript" src="./dist/vendor.bundle.js"></script>
<script type="text/javascript" src="./dist/bundle.js"></script>
I'd like to inject required files between vendor.bundle.js - which, as I suspect contains all remaining libraries merged into one file - and bundle.js - which contains my game. I could also inject them at the end of vector.bundle.js, it doesn't matter for me. Unfortunately I don't know how to do that.
Let's say that's the list of files I need to load:
<script src="./libs/dragonBones/dragonBones.js"></script>
<script src="./out/DragHelper.js"></script>
<script src="./out/BaseDemo.js"></script>
<script src="./out/HelloDragonBones.js"></script>
<script src="./out/AnimationBase.js"></script>
<script src="./out/DragonBonesEvent.js"></script>
<script src="./out/AnimationLayer.js"></script>
<script src="./out/BoneOffset.js"></script>
<script src="./out/InverseKinematics.js"></script>
<script src="./out/BoundingBox.js"></script>
<script src="./out/ReplaceSlotDisplay.js"></script>
<script src="./out/ReplaceAnimation.js"></script>
<script src="./out/CoreElement.js"></script>
<script src="./out/PerformanceTest.js"></script>
Is there a way to modify index.html template to include them between these two files mentioned earlier? Or maybe there is better way of doing that?
I have a feeling I'm missing something obvious, could someone please help? I'm unable to reference jquery and mustache using <script> tags.
404 messages
file structure 1
file structure 2
<script src='/js/handlebars-v3.0.1'></script>
<script src='js/handlebars-v3.0.1'></script>
<script src="js/jquery-1.11.2.min"></script>
<script src='http://localhost/learning/js/handlebars-v3.0.1'></script>
<script src="js/main.js"></script>
if you notice, I'm able to read in main.js just fine using <script src="js/main.js"></script> but not with <script src='js/handlebars-v3.0.1'></script>
appreciate any help, thanks.
You misspelled the Javascript file names:
It should be:
<script src="js/jquery-1.11.2.min.js"></script>
<script src="js/handlebars-v3.0.1.js"></script>
<script src="js/main.js"></script>
Same for other Javascript files. Also, you included multiple copy of same JS.
Side note: use either double quote or single quotes only, for tidiness sake
Something peculiar is happening for me with jquery-ui. I'm importing several pieces of jquery-ui separately in my HTML:
<script type="text/javascript" src="../third-party/jquery-1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="../third-party/jquery-ui-1.10.4/jquery-ui.core.min.js"></script>
<script type="text/javascript" src="../third-party/jquery-ui-1.10.4/jquery-ui.widget.min.js"></script>
<script type="text/javascript" src="../third-party/jquery-ui-1.10.4/jquery-ui.mouse.min.js"></script>
<script type="text/javascript" src="../third-party/jquery-ui-1.10.4/jquery-ui.datepicker.min.js"></script>
Yet, when I load the HTML, I get undefined is not a function when my javascript attempts to use $.widget. The offending line in jquery-ui.widget.js is:
basePrototype = new base();
I'm perplexed. Did I miss a dependency somewhere? It doesn't seem like I did, but I must be missing something. I also tried it with the jquery-ui.custom.js that jquery-ui's website provided instead, to no avail. I'm always including jquery first.
I think this one is relevant:
jQuery.ui.draggable.js and jQuery.ui.widget.js conflict
Try if top answer in this question works for you.
I am using Laravel-4-Bootstrap-Starter-Site. I have this issue loading javascript files: Error: Popover requires tooltip.js It seems that is not causing majors problems but I am losing functionality.
Checking source code we can see that popover is loaded first and before than tooltip file.
<!-- Javascripts -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/popover-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/tab-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/alert-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/transition-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/modal-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/scrollspy-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/carousel-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/dropdown-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/tooltip-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/collapse-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/button-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/4e833b1b206008719982ee4bd4edd6f2/affix-49fe37fdd6b1d004e71a46c3650d6e3b.js"></script>
<script src="http://code.dev/assets/compiled/admin/assets/js/wysihtml5/wysihtml5-0.3.0-5f4b6ad2a53f7fc45751886caf6076e2.js"></script>
<script src="http://code.dev/assets/compiled/admin/assets/js/wysihtml5/bootstrap-wysihtml5-5f4b6ad2a53f7fc45751886caf6076e2.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
<script src="http://code.dev/assets/compiled/admin/assets/js/datatables-bootstrap-5f4b6ad2a53f7fc45751886caf6076e2.js"></script>
<script src="http://code.dev/assets/compiled/admin/assets/js/datatables.fnReloadAjax-5f4b6ad2a53f7fc45751886caf6076e2.js"></script>
<script src="http://code.dev/assets/compiled/admin/assets/js/jquery.colorbox-5f4b6ad2a53f7fc45751886caf6076e2.js"></script>
<script src="http://code.dev/assets/compiled/admin/assets/js/prettify-5f4b6ad2a53f7fc45751886caf6076e2.js"></script>
<script src="http://code.dev/assets/compiled/admin/assets/js/jquery.uploadfile-88e9f41770fc597c379b2a75086bcb0f.js"></script>
<script src="http://code.dev/assets/compiled/admin/assets/js/common-75a4c5198cfe0c4468991a6000253513.js"></script>
<script type="text/javascript">
$('.wysihtml5').wysihtml5();
$(prettyPrint);
</script>
Question: is there a way to solve this issue?
I have had the same problem. The reason that happens is because basset loads the resources in order by name. and since p comes before t obviously it gets loaded afterwards coming up with the error. Hacking your way around the problem simply rename tooltip with to atolltip in vendors/twbs/bootstrap/js or instead requiring the directory to load the files in basset config you require each single js file in the order you want. The second option i did not test but should work.
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=.......&sensor=false&libraries=places"></script>
I want to add &libraries=geometry into the script above, how describe it?
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=.......&sensor=false&libraries=places&libraries=geometry"></script>
or
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=.......&sensor=false&libraries[]=places&libraries[]=geometry"></script>
According to the documentation, you should give multiple libraries comma-separated:
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=.......&sensor=false&libraries=places,geometry"></script>
you cannot specify to variables with the same name, the post/get script will only handle one of those
I suggest you replace 'libraries=places&libraries=geometry' with 'libraries=places,geometry' and see how that works for you.