Javascript 带有嵌套表单的jQuery对话框

我有一个jQuery对话框，里面有一个嵌套的表单。表单包含一个输入框和一个提交按钮。当对话框弹出时，我希望用户只能填写它，而不能在页面上填写其他内容。我的css在这里完成：

.ui-widget-overlay 
{
    height: 1339px !important;
    width: 595px !important;
}

这允许用户不在页面上执行任何其他操作，但问题是输入字段也被禁用

有什么建议吗

编辑：下面是我创建对话框的方法

function dialog(left, top) {

    //Creates a new dialog
    $('#dialog').dialog({
        position: [left, top],
        height: 90,
        width: 200,
        resizable: false,
        modal: true,
        title: '<span class="ui-icon ui-icon-home"></span> Enter Info',
    });
}

函数对话框（左，上）{
//创建一个新对话框
$（'#dialog'）。dialog({
位置：[左，上]，
身高：90，
宽度：200，
可调整大小：false，
莫代尔：是的，
标题：“输入信息”，
});
}

以下是我用于对话框的表单：

<!-- Store Location Dialog -->
<div id = "dialog">
    <form id = "info" method = "post" action = "Default.aspx" \> 
        <input type = "text" id = "changeDialogText" name = "changeLocation" /> <!-- THIS IS DISABLED -->
        <input type = "button" id = "changeDialogSubmit" value = ""  onclick = "function()"/> 
    </form>
</div>

我解决了这个问题。我的表格的

z-index

低于页面的

z-index

。这导致对话框出现问题，因为不确定输入是在对话框中还是在第页上。上面没有提供正确的文字答案<代码>z索引自动不会剪切它

title: 'Quantity 1',
autoOpen: false,
show: 'slide',
hide: 'explode',
resizable: true,
stack: true,
height: "200",
width: "790",
zIndex: "auto",
modal: true

---

为什么不使用？为什么要摆弄CSS呢？我在JS中这么做。我会把代码添加到edit@SsRide如何禁用字段？你能澄清一下吗？我添加了用于创建对话框的代码。希望这能澄清一些问题。此外，按钮没有被禁用，只是输入字段。如果要在字符串中使用一组双引号，请尝试将其包装为单引号。使它更具可读性，更不容易出错。我在表单上使用

z-index:auto

来解决这个问题。