简体   繁体   中英

Using exclusively Bootstrap3

I have the following situation, I have many scripts and they conflict with each other.

I want to use something like that:

$Bootstrap3('.dropdown-toggle').dropdown();

And for jQuery(normally $ ).

UPDATED

My task is to add Bootstrap to an existing project( css problem ), I have bootstrap , Knockout , JQuery and someother scripts.

I wanted to access the bootstrap -code explicit, so that I can make sure that no other scripts will be affected(because I don't know that project and I don't know how they will react with bootstrap.js)

My current script order(I get no errors at the moment, but the project is big, so I don't know what will happen):

var bootstrap3 = new Bundle("~/Scripts/bundle/CoreScripts").Include(
// "~/Scripts/jquery/jquery-2.1.3.js",//used before, commented out
"~/Scripts/jquery-1.11.3.min.js",// what I added
"~/Scripts/bootstrap.min.js",// what I added
"~/Scripts/jquery.formatter/jquery.formatter-0.1.5.js",
"~/Scripts/jquery.ui/jquery.ui-1.11.3.js",
"~/Scripts/knockout/knockout-3.3.0.js",
"~/Scripts/knockout/knockout.mapping-2.4.1.js",
"~/Scripts/formvalidator.net/form-validator/jquery.form-validator.js",
"~/Scripts/iban/iban.js",
"~/Scripts/sweetalert/sweet-alert.js",
"~/Scripts/jsNumberFormatter/jsnumberformatter.js",
"~/Scripts/jsNumberFormatter/jsnumberformatter.locale.js",
"~/Scripts/jquery.jqGrid/i18n/grid.locale-de.js",
"~/Scripts/jquery.jqGrid/jquery.jqGrid.js");
bootstrap3.Orderer = new BundleOrderer();
bundles.Add(bootstrap3);

Only the core libs are shown above.

Something like this $Bootstrap3(...) would be cool... and I don't want to use for all the other scripts something like .noConlfict()

The bootstrap plugins all have a method called noConflict that does what you're looking for.

// return $.fn.button to previously assigned value
var bootstrapButton = $.fn.button.noConflict()
// give $().bootstrapBtn the Bootstrap functionality
$.fn.bootstrapBtn = bootstrapButton            

After this code runs $('#example').button() will be what it was before bootstrap was loaded and $('#example').bootstrapBtn() will be plugin from bootstrap.

For this to work, the bootstrap JS file will have to be loaded after the one with a name conflict.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM