Question

更新 - jsfiddle：http://jsfiddle.net/bLURx/4/

在我的主屏幕上，我有一个虚拟键盘的内联实例，工作正常。

此屏幕上的表中有链接将打开包含另一个表的JQuery对话框，其中一列是每行的文本框。我为每个生成的文本框初始化一个键盘，这样用户就可以为每个框输入一个弹出键盘来输入一些数字。

这一切都达到了这一点。我不得不更改弹出键盘的z-index，使它们出现在对话框的上方，但现在我可以点击每个框，键盘将按原样滑入。每当我点击键盘上的任何按钮时，就会出现问题。点击任何按钮后，每个键盘都会自动关闭，并打开表格中顶部行上方的键盘。这个顶部键盘在点击时会保持打开状态，但不会向任何字段添加文字。

用于对话框/初始化弹出键盘的jQuery函数：

$(function () {
        var createdPads = []; 
        $('#dialog').dialog({
            autoOpen: false,
            modal: true,
            width: '95%',
            height: 1000,
            open: function (event, ui) {
                $('#dialog :text').each(function () {
                    $(this).keypad({
                        keypadOnly: false,
                        keypadClass: 'miniPad'
                    });
                    createdPads.push(this);
                });
            },
            close: function (event, ui) {
                for (i = 0; i < createdPads.length; i++) {
                    createdPads[i].remove();//removing created keypads because they were affecting the previous inline keypad 
                }
                $('#<%=enterNumberBox.ClientID%>').blur();//removing focus from original field
                var tbl = $('#<%=gvData.ClientID%>');
                if (tbl.is(":visible")) { //scrolling back down to results after dialog close
                    $(window).scrollTop(tbl.position().top);
                }
            }
        });
    });

弹出式键盘的CSS类：

.miniPad{
    z-index: 9999 !important; 
}

HTML：

<div id="dialog" style="display: none; text-align: center;">
    <span class="ui-helper-hidden-accessible"><input type="text"/></span><!--to prevent autofocus-->    
    <asp:GridView runat="server" ID="gvItemData"></asp:GridView>
    <asp:Button ID="updateStagedButton" runat="server" Text="Update" OnClientClick="return validateUpdate();" />
</div>

一旦我有足够的代表，我会添加一个我正在谈论的截图。

谢谢！

Answer 1

确定解决了： - ）

演示：http://jsfiddle.net/robschmuecker/Tut8M/

据推测，这确实与对话有关。默认情况下，它会阻止与不属于它的子元素的任何交互，当它们绝对位于出现时会导致问题。

http://api.jqueryui.com/dialog/#method-_allowInteraction

谢天谢地，有一种方法可以覆盖它，这是通过设置 _allowIteraction()功能

$.ui.dialog.prototype._allowInteraction = function (e) {
        return !!$(e.target).parents(".miniPad") || this._super(event);
    };

这将检查交互元素是否具有类miniPad的父类，如果它具有，则它允许它。这很好地解决了问题。

虚拟键盘（Keith Wood）在JQuery对话框内的文本框上初始化时，每次点击都会自动关闭

更新 - jsfiddle：http://jsfiddle.net/bLURx/4/

1 个答案: