javascript - Bootbox 动态 html 输入不允许输入

Question

我需要为 Bootbox 显示一个自定义 HTML 模板，并且我有两个输入字段，如下所示

var txtbox = "<div class=\"row padding-10\">" +
                    "<form class=\"form-horizontal\">" +
                    "<div class=\"form-group\">" +
                    "<label for=\"username\" class=\"col-sm-2 col-sm-offset-2 control-label\">Username</label>" +
                    "<div class=\"col-sm-6\">" +
                    "<input type=\"text\" class=\"form-control\" id=\"username\">" +
                    "</div>" +
                    "</div>" +
                    "<div class=\"form-group\">" +
                    "<label for=\"username\" class=\"col-sm-2 col-sm-offset-2 control-label\">Password</label>" +
                    "<div class=\"col-sm-6\">" +
                    "<input type=\"password\" class=\"form-control\" id=\"password\">" +
                    "</div>" +
                    "</div>" +
                    "</form>" +
                    "</div>";

并将上面的 HTML 像下面这样嵌入到 Bootbox

var getUsername = function () {
                    return $("#username").promise();
                };

                var getPassword = function () {
                    return $("#password").promise();
                };

                bootbox.dialog({
                    title: $rootScope.app.locale.labels.supervisor_required,
                    message: txtbox,
                    buttons: {
                        success: {
                            label: "Ok", className: "btn-primary", callback: function () {
                                getUsername()
                                    .done(function (userName) {
                                        getPassword()
                                            .done(function (password) {
                                                if (typeof (model) !== "undefined") {
                                                    model.OverrideUsername = userName.val();
                                                    model.OverridePassword = password.val();
                                                }
                                                deferred.resolve();
                                            });
                                    });
                            }
                        }
                    }
                }).on('shown.bs.modal', function () { $('#username').focus() });
                return deferred.promise;

我无法在文本框中输入任何内容。我尝试设置 z-index 并调整 CSS，但没有任何帮助。有人可以帮我吗？

标签： javascripthtmlcssangularjsbootbox