Question

我在注册过程中有以下表格：

            <form class="form1" id="register_form1" method="POST" action="<?php echo $register_url; ?>" name="register_form1">

            <!-- other parts of the form that are not relevant to this question -->             
            <!-- text input area to conduct a search -->
             <span style="text-align: left; width: 100%;margin-left:40px;">Select a primary recruiter</span>
             <div class="ansDiv">
             <table style="float: left;">
               <tr>
               <td>
               <input type="text" id="primary_recruiter" name="primary_recruiter" value="" onkeypress="searchKeyPress(event);"> 
               </td>

               <td>
               <input type="button" id="buttonSearch" value="" class="button_search" name="seachprimary" onclick="javascript: searchRecruiter();">
               </td>

               <td>
               <a class="highlight" href="../images/PrimaryRecruiter.gif" style="float: right; padding-right: 655px;">
               <img src="../images/Q-btn.png">
               </a></td>                    

               <td>
               <input type="hidden" id="primary_recruiter_id" name="primary_recruiter_id" value="">
               </td></tr>
            </table>            

            <!-- last part of the form that is not relevant to this question -->

            <!-- Submit button for the page itself. -->
            <p align="center">
              <input type="submit" class="button_submit" name="register1_submit" value="" />
            </p>
            </form>

            And here's the javascript I have setup to implement a button press on Enter:


            <script type="text/javascript">

             function searchRecruiter(){
             var temp = $("#primary_recruiter").val();
                $.ajax({
                    type : 'GET',
                    url : 'searchrecruiter.php',
                    data: "name="+temp,
                    success : function(data){
                     $("#displayrecruiterlist").html(data);
                    }//end function(data) call
              });//end $.ajax call
             }//end searchRecruiter

            //other java scripts
            </script>


            <!-- Press enter to search... -->    
              <script type="text/javascript">
                function searchKeyPress(e){

                    // look for window.event in case event isn't passed in
                    if (typeof e == 'undefined' && window.event) { e = window.event; }
                    if (e.keyCode == 13){
                        document.getElementById('buttonSearch').click();
                    }               
                }
            </script>

当我在文本输入框中按Enter键时，我最终会在document.getElementByID（'buttonSearch'）上结束.Click（）;这样才行。但那就是了页面响应好像我点击了提交，没有id属性。

当我点击搜索按钮时，它按预期工作。我究竟做错了什么？我以为我点击了那个搜索按钮，但这不是我的反应。

感谢。

要记住的事项：我是网络开发（PHP，JavaScript等）的新手，并且正在学习工作。如果我需要提供其他任何东西，请告诉我。

Answer 1

在文本输入字段上按Enter键将提交父表单。因为搜索字段/按钮实际上正在执行它们自己的功能（通过AJAX调用来提取数据），所以它们可能根本不应该在表单内部。我建议将这些物品拉出来并将它们放在表格标签之外。这将解决您的问题。

另一种选择是在onkeypress事件中返回false。

仅供参考，onclick =“”是javascript语法，因此javascript：开头是隐含且不必要的。

针对“搜索”按钮的OnPress事件会触发整个页面的“提交”按钮

1 个答案: