jquery自动完成文本框不能与master&；一起使用；ASP.NET中的内容页_Jquery_Autocomplete_Master Pages

jquery自动完成文本框不能与master&；一起使用；ASP.NET中的内容页

jquery autocomplete

jquery自动完成文本框不能与master&；一起使用；ASP.NET中的内容页,jquery,autocomplete,master-pages,Jquery,Autocomplete,Master Pages,我有一个母版页，其中有以下代码 <head runat="server"> <link href="StyleSheet.css" rel="stylesheet" runat="server" type="text/css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></scrip

我有一个母版页，其中有以下代码

<head runat="server">
    <link href="StyleSheet.css" rel="stylesheet" runat="server" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
    <asp:contentplaceholder id="LocalScripts" runat="server"></asp:contentplaceholder>
</head>

<body id="body" runat="server">
    <form id="form1" runat="server" defaultbutton="SignOutLB">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </form>
</body>

<asp:Content ID="ScriptContent" ContentPlaceHolderID="localScripts" runat="server">
<script type="text/javascript">
    function suggest(inputString)
    {
        if(inputString.length == 0) 
        {
            $('#suggestions').fadeOut();
        } 
        else 
        {
            $('#AAATB').addClass('load');
            $.post("AutoSuggest.aspx?ST=" + inputString, function(data){
                if(data.length >0) 
                {
                    $('#suggestions').fadeIn();
                    $('#suggestionsList').html(data);
                    $('#AAATB').removeClass('load');
                }
            });
        }
    }

    function fill(thisValue) 
    {
        $('#AAATB').val(thisValue);
        setTimeout("$('#suggestions').fadeOut();", 600);
    }
</script>
</asp:Content>

我的内容页有以下代码

<head runat="server">
    <link href="StyleSheet.css" rel="stylesheet" runat="server" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
    <asp:contentplaceholder id="LocalScripts" runat="server"></asp:contentplaceholder>
</head>

<body id="body" runat="server">
    <form id="form1" runat="server" defaultbutton="SignOutLB">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </form>
</body>

<asp:Content ID="ScriptContent" ContentPlaceHolderID="localScripts" runat="server">
<script type="text/javascript">
    function suggest(inputString)
    {
        if(inputString.length == 0) 
        {
            $('#suggestions').fadeOut();
        } 
        else 
        {
            $('#AAATB').addClass('load');
            $.post("AutoSuggest.aspx?ST=" + inputString, function(data){
                if(data.length >0) 
                {
                    $('#suggestions').fadeIn();
                    $('#suggestionsList').html(data);
                    $('#AAATB').removeClass('load');
                }
            });
        }
    }

    function fill(thisValue) 
    {
        $('#AAATB').val(thisValue);
        setTimeout("$('#suggestions').fadeOut();", 600);
    }
</script>
</asp:Content>


函数建议（inputString）
{
如果（inputString.length==0）
{
$（“#建议”）.fadeOut（）；
} 
其他的
{
$（'AAATB'）.addClass（'load'）；
$.post（“AutoSuggest.aspx？ST=“+inputString，函数（数据））{
如果（data.length>0）
{
$（“#建议”）.fadeIn（）；
$（'#SuggestionList'）.html（数据）；
$（'AAATB'）.removeClass（'load'）；
}
});
}
}
函数填充（thisValue）
{
$（'AAATB'）.val（该值）；
setTimeout（“$（'#建议”）.fadeOut（）；”，600）；
}

ASP.NET代码如下所示

<asp:TextBox ID="AAATB" runat="server" Width="90px" MaxLength="6" onkeypress="return IsNumberKey(event)" CssClass="textboxStyle" ValidationGroup="projNoValGp" onkeyup="suggest(this.value);" onblur="fill();" />
<div class="suggestionsBox" id="suggestions" style="display: none;"> 
    <img src="Images/arrow.png" style="position: relative; top: -2px; left: 50px;" alt="" />
    <div class="suggestionList" id="suggestionsList"> &nbsp; </div>
</div>

我的AutoSuggest.aspx有以下代码。（我这样做是为了测试。功能正常后，我将更改此代码以从数据库检索数据。）

受保护的无效页面加载（对象发送方，事件参数e）
{
字符串[]arr=新字符串[]{
"1234",
"1111",
"1333",
};
对于（int i=0；i<3；i++）
{
写（“”+arr[i]+“”；
}
}

这在显示值“1234”、“1111”、“1333”时起作用。但当我选择其中一个值时，它不会反映在文本框“AAATB”中

我将非常感谢为解决这个问题所提供的一切帮助

谢谢，卡罗莱纳州我想我知道。您使用“#AATB”作为文本框的选择器。但是，这是一个服务器端ID，将在客户端上以不同方式呈现。尝试将此用作填充代码：

function fill(thisValue)
{
    $('.textboxStyle').val(thisValue);           
    setTimeout("$('#suggestions').fadeOut();", 600);
}

我们的想法是使用css类作为文本框的选择器，因为它没有被修改。

你能看到js方法fill（）是否被调用吗？通过调试或向函数添加一条警报语句。是的，它被调用了。但是我可以看到参数“thisValue”被调用了“没有定义。嗯……真奇怪。你能验证li标签在你的浏览器中是如何呈现的吗（通过使用FireBug或IE Dev工具栏）？我确实使用了IE。但它根本不显示

标签。为供参考，我添加了屏幕截图。如果在显示自动完成选项后单击IE工具栏中的刷新按钮（保存按钮旁边），它们也将显示在工具栏中。顺便说一句，我看不到截图？你的想法是正确的。但是，上面提到的代码不适合我，因为它用所选的值填充了屏幕上的所有文本框。所以，我只是对它做了一些修改，如下所示：函数fill（thisValue）{$（“#”）val（thisValue）；setTimeout（$（“#建议”）.fadeOut（）；”，600）}，它可以工作。谢谢你及时的帮助！没问题，很高兴我能帮忙！