输入字段不能正常工作

我在ModalPopupExtender中显示简单的<input type="text" />，它显示在ColorBox的顶部。它显示正常，但用户无法写入。谁能说出有什么问题？输入字段不能正常工作

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %> 
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> 
<script src="Scripts/jquery.colorbox-min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#testbutton').click(function() { 
      $.colorbox({ inline: true, width: "50%", open: true, href: "#messageform", 
       onClosed: function() { 
        $('#messageform').hide(); 
       }, 
       onOpen: function() { 
        $('#messageform').show(); 
       } 
      }); 
     }); 
    }); 
</script> 
</asp:Content> 


<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 

    <input id="testbutton" type="button" value="click" /> 

    <div id="messageform" style="display: none;"> 
     <asp:Button ID="open" runat="server" /> 
    </div> 

    <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground" 
     DropShadow="true" PopupControlID="Panel1" TargetControlID="open"> 
    </ajaxToolkit:ModalPopupExtender> 

    <div id="Panel1"> 
     <input type="text" name="foo" value="" /> <--- **This shows, but can't enter text** 
    </div> 
</asp:Content>

来源

2013-05-16 perene

你可以点击文本框，或者如果你检查元素，它是否进入文本框或重叠它的东西？ – Pete

它显示正确的光标，但单击时不显示“闪烁光标”。我检查过这个元素，看起来并不像它前面的东西。代码可以通过下载最新版本的Colorbox进行测试。 – perene

在最后的标记中，输入标记是否具有只读属性？ –

我写信给彩盒的作者，他跟踪这个问题到了下面几行：

if (document.addEventListener) { 
    document.addEventListener('focus', //trapFocus, true); 
       $events.one(event_closed, function(){ 
       document.removeEventListener('focus', trapFocus, true); 
       ;}

我outcommented的，现在它似乎工作（不知道旧的IE版本和其他问题虽然）。

来源

2013-05-16 15:10:08 perene

使用更新版本的colorbox，可以使用trapFocus：false设置，该设置会禁用同一段代码。这通常是比制作js的自定义版本更好的解决方案。 – fuz

感谢您的回复，请看看:-) – perene

trapFocus：false是否有窍门 –

name属性是误解。也许你可以尝试给它一个空值

<input type="text" name="foo" value="" />

onClosed和onOpen做什么？你的CSS看起来如何？或者是输入中的弹出层（或覆盖层）？检查z-index。

来源

2013-05-16 12:58:13 Andi

我已添加名称和值，仍然不可编辑。对于这个例子，没有CSS，只是写了它，所以很容易测试。 z-index是可以的。如果我改变输入下拉菜单，它可以在Chrome浏览器中使用，但IE浏览器和Firefox浏览器不支持IE浏览器和Firefox浏览器。 – perene

输入字段不能正常工作

回答

相关问题