【问题标题】:Form Search Onkeyup event表单搜索 Onkeyup 事件
【发布时间】:2012-12-19 05:01:42
【问题描述】:

我有一个表单,当我在文本字段中输入第 10 个字符时,表单应该自动搜索,但下面的代码正在搜索我在文本字段中输入的每个字符。 . .我只想要完成第 10 个字符后的结果,而不是每个字符。 .我使用了onkeyup 事件并将该值设置为 10,但它仍然在搜索每个字符...请帮帮我

<body OnKeyPress="return disableKeyPress(event)">
<section id="content" class="container_12 clearfix" data-sort=true>
    <center><table class='dynamic styled with-prev-next' data-table-tools='{'display':true}' align=center>
        <script>
        function disableEnterKey(e)
        {
            var key;      
            if(window.event)
                key = window.event.keyCode; //IE
            else
                key = e.which; //firefox      

            return (key != 13);
        }

        function showUser(str)
        {

            if (str=="")
            {
                document.getElementById("txtHint").innerHTML="";
                return;
            } 
            if (window.XMLHttpRequest)
            {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
            else
            {// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
                }
            }
            xmlhttp.open("GET","resdb.php?id="+str,true);
            xmlhttp.send();
        }
        </script>

        <script type='text/javascript'>
        //<![CDATA[ 
        $(window).load(function(){
            $('#id').keyup(function(){
                if(this.value.length ==10)
            });
        });//]]>  

        </script>



        <form id="form" method="post" name="form" >
            <tr><td><p align="center"><font size="3"><b>JNTUH - B.Tech IV Year II Semester (R07)   Advance Supplementary Results - July 2012</b></font></p></td></tr>
            <td><p align="center"><b>Last Date for RC/RV : 8th August 2012</b></p></td>
            <tr><td><p align="center"></b> <input type="text" onkeyup="showUser(this.value)"   onKeyPress="return disableEnterKey(event)" data-type="autocomplete"  data-source="extras/autocomplete1.php" name="id" id="id" maxlength="10" placeholder="Hall-Ticket Number">&emsp;</p></td></tr>
        </form>
    </center>
</table>
<center>
    <div id="txtHint"><b>Results will be displayed here</b></div>
</center>
</body>

【问题讨论】:

  • 仍然看到看起来如此古老的代码真是太神奇了。这是哪里来的?你想做什么?
  • @elclanrs 对不起。 .我没有得到你。 .仍然请您帮助我或建议我使用此方法或任何较新的方法。 .谢谢你
  • 这是关于centerb 标签的,它让我想起了过去。但作为提示,您检查密钥的第一块代码可以减少到一行:var key = e.which || e.keyCode
  • 加上你好像在用jQuery,为什么复杂的AJAX请求,用$.ajax就简单多了。
  • @elclanrs 我只是学习 Ajax 和 jquery 的朋友,所以我不太了解这些,我是初学者。 .如果你能解释我或给我看,我将非常感激,谢谢

标签: javascript ajax forms jquery-events onkeyup


【解决方案1】:

这是一个想法,因为您的代码正在运行。这样做。首先检查您的文本字段是否超过 10 个字符。调用 fnc() onkeyup

function fnc()
 {
  length=document.getElementById("atext").value.length;
  if(length==10)
  {
      callyourajaxfunction()
   }


}

【讨论】:

  • @Aryan 你输入了超过 10 个字符吗?
  • 不只有十个字符,因为我已经将文本字段限制为 10 个字符,并且只有在输入第 10 个字符时才需要得到结果
  • function showUser(str) { { length=document.getElementById("id").value.length; if(length==10) {AJAX 代码}}} 工作......非常感谢
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2023-04-04
  • 1970-01-01
  • 2018-08-07
  • 2018-04-14
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多