jQuery 插件在模态中不起作用

发布于 2024-07-23 12:29:18 字数 636 浏览 4 评论 0原文

我在模式中使用它: http://www.web2media.net/laktek/2008/10/27/really-simple-color-picker-in-jquery/ 但它不起作用。 相同的代码:

//Start of document Ready which contains event handlers
$(document).ready(function() {

    $('#ForeColor').colorPicker();
});

<input type="text" value="#333399" id="ForeColor" class="colourPicker" />

在普通页面中工作正常,但一旦我将其加载到 jQuery UI 模态(其内容来自 ASP.Net MVC 部分视图)中,它就会崩溃! 它完成了一些工作,即重新格式化文本框以显示当前颜色,但单击它不会导致选择器出现!

我怀疑这是在模态中使用 jQuery 的问题。

有什么想法吗?

I am using this in a modal: http://www.web2media.net/laktek/2008/10/27/really-simple-color-picker-in-jquery/ but it does not work. The same code:

//Start of document Ready which contains event handlers
$(document).ready(function() {

    $('#ForeColor').colorPicker();
});

<input type="text" value="#333399" id="ForeColor" class="colourPicker" />

works fine in a normal page but as soon as I load it in a jQuery UI Modal (the contents of which come from an ASP.Net MVC partial view) it breaks! It does some of the work, i.e reformats the text box to show the current colour but clicking it does not cause the selector to appear!

I suspect it's an issue with using jQuery inside modals..

Any ideas?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

酷遇一生 2024-07-30 12:29:18

好吧,明白了,实际上相当愚蠢!

基本上,当您加载模态时,它显然位于同一页面上,并且出现在其他元素之上,jQuery UI 模态的 z 索引为 1002!

因此,页面上的任何元素(包括许多 jQuery 弹出元素)都会出现在模式下方,因此看起来不起作用。 只需将更高的 z-index (1003+) 添加到颜色选择器或其他 jQuery 弹出 css 样式即可。

对于我链接到的 div,我需要添加的是:

div#color_selector 
{
   //other stuff
   z-index: 1120; 
}

希望对其他人有帮助。

Ok figured it out, rather stupid actually!

Basically when you load a modal it is obviously on the same page and to appear above other elements the jQuery UI modal has a z-index of 1002!

As a result any elements on your page, including a lot of jQuery popup elements, will appear underneath the modal and hence appear not be working. Just add a higher z-index (1003+) to the color picker or other jQuery popup css style.

For the one I linked to the div I needed to add was:

div#color_selector 
{
   //other stuff
   z-index: 1120; 
}

Hope that helps anyone else.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文