jquery-ui.css 最后出现时,该文件中的CSS会覆盖引导程序中任何对应的冲突CSS,因此现在您可以利用jquery UI CSS代替引导CSS定义(如果有的话)I'm using jquery 1.11.3 with jquery-ui 1.11.4 and with bootstrap 3.3.5 .All works fine except for standard close minibutton on the jquery ui dialog upper left corner. The symbol "X" doesn't show on the button, nonetheless it works in closing the dialog. Examining the markup created for the dialog, it really lacks the part that show the "X" icon.The dialog is very simple:$('#info').dialog({ autoOpen: true, width: 700, title: 'User Info', position: { my: "center middle", at: "center middle", of: document.body} } );I'm aware of the compatibility issues between jquery-ui and bootstrap, due to name collision on button and tooltip plugins.So I applied the workaround suggested in https://stackoverflow.com/a/27745464/1233379 but whereas it prevent some javascript error, it not seems to restore full functionality of dialog.Commenting out bootstrap javascript include tag, jquery-ui works as expected.Some advice?Here's the fiddle: https://jsfiddle.net/43hrvy26/ 解决方案 You can change the order of the JS/CSS inclusionhttps://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.jshttps://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.csshttps://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.csshttps://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.jshttps://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.jshttps://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.cssRefer https://jsfiddle.net/ZigmaEmpire/43hrvy26/2/As jquery-ui.css comes last the CSS in that file will override any corresponding conflicting CSS in bootstrap, so now you can take advantage of jquery UI CSS instead of bootstrap CSS definitions if any 这篇关于jQuery UI对话框按钮不适用于引导程序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持! 上岸,阿里云!
09-05 15:39