Question

我在jQueryUI对话框上有一个x-editable select输入。但是，单击时，它不允许在使用Firefox渲染时更改它（但可以与Chrome和IE一起使用）。如果你关闭对话框，我有另一个不在对话框上，它完美无缺。我在想它可能与CSS z-access有关，但我不确定。如何在使用Firefox的jQueryUI对话框上使用x-editable的选择输入？

http://jsbin.com/wesategigu/edit?html,output

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Testing</title>  
        <link href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/ui-lightness/jquery-ui.css" type="text/css" rel="stylesheet" />
        <link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.1/jqueryui-editable/css/jqueryui-editable.css" type="text/css" rel="stylesheet" />
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.js" type="text/javascript"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.js" type="text/javascript"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.1/jqueryui-editable/js/jqueryui-editable.js" type="text/javascript"></script>
        <script type="text/javascript"> 
            $(function(){
                $("#dialog").dialog({
                    modal       : true,
                    open        : function() {
                        $('#status').editable({
                            value: 2,    
                            source: [
                                {value: 1, text: 'Active'},
                                {value: 2, text: 'Blocked'},
                                {value: 3, text: 'Deleted'}
                            ]
                        });
                    }
                });
                $('#status2').editable({
                    value: 2,    
                    source: [
                        {value: 1, text: 'Active'},
                        {value: 2, text: 'Blocked'},
                        {value: 3, text: 'Deleted'}
                    ]
                });
            });
        </script>
    </head>

    <body>
        <div id="dialog">
            <a href="#" id="status" data-type="select" data-pk="1" data-url="/post" data-title="Select status"></a>
        </div>
        <a href="#" id="status2" data-type="select" data-pk="1" data-url="/post" data-title="Select status"></a>
    </body> 
</html>

无法在使用Firefox

0 个答案: