尽管我无法重现这个问题,但特里·塞德勒的回答是有效的。您将遇到与已有对话框和 JQuery 的站点发生冲突的情况。
你有两种方法来解决这个问题(我不认为“无冲突”方法会起作用,因为你也在使用 UI 插件)
检查是否$
被定义并且$.dialog
被定义为。如果已定义,则使用站点拥有的内容,否则使用动态加载 http://unixpapa.com/js/dyna.html
使用原始 JS 添加处理程序onload
对于页面/窗口,并运行一个函数。在此函数中,您应该粘贴 JQuery 和 JQuery-UI 的代码。此方法使用函数的作用域来避免命名空间问题。
为了让方法2更清楚,想象一下下面的JS代码
function printMe() { alert("this will print me"); }
function printMeToo(){
function printMe(){ alert("this will print me too"); }
printMe();
}
printMeToo();
这段代码应该提醒“这也会打印我” - 并运行printMe
页面上的其他任何地方都会提醒“这将打印我”。这样您就不会损害正在加载的页面(这也是您应该考虑的事情),并且它们不会对您产生影响。
它会是什么样子?
为了了解如何添加原始 JS onload 处理程序,您可以查看这个计算器问题 https://stackoverflow.com/questions/4558325/adding-multiple-onload-handlers。
可以说它是这样的document.addEventListener( 'onload', function () { ... /* important stuff */ });
重要的是这个函数会是什么样子?这就是预期的结构
function(){ /* important stuff function */
// paste here JQuery definition code (copy paste into here... ) make sure to use the minified code!
(function(a,b){function G(a) ... {return p})})(window);
// paste other plugins code as well. dialog + ...
....
// now your code should be here, exactly like you posted it untouched
$("myelement"); // this uses MY JQuery version, and my JQuery-UI version and my plugins without the possibility of an override. The site cannot override my code, and I cannot override the site's code.
} /* end of really important stuff function here */
想看看这个方法的实际运行情况吗?
我用以下方式保护我的网站蒴果 http://www.incapsula.com/- 所以他们在我的网站上显示了他们的印章(有点像你的对话框) - 看到右下角的浮动 div 了吗?他们也使用 JQuery 和其他东西,就像我在这里指定的那样。
顺便说一句 - 关于 CSS - 你可能会遇到同样的问题。例如,您引用类 .bottom - 其他站点可能有自己的确切类和 CSS。确保用一个非常唯一的 ID 包装整个对话框代码(例如gjkelrgjkewrl849603856903ID
- 并用它启动所有 CSS 选择器以避免冲突)。