Question

为什么以下页面不适用于所包含的表单标记（如下所示），但是当它们被删除时会如何？（jquery新手，很明显......）

 <!DOCTYPE html>
 <head>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script language="JavaScript">
      $(document).ready(function () {
            $("button").click(function () {
              $('#inputid').focus();       
            });
    });
    </script>
 <head>
 <body>

 <form>
     <input type="text" id="inputid">
     <button>Click Me</button>
 </form>

 </body>
 </html>

Answer 1

因为<button>（在您正在使用的浏览器中）的默认行为是提交的。因此，当您单击包含表单标签的按钮时，表单将执行POST。

submit：创建提交按钮。这是默认值。

http://www.w3.org/TR/html401/interact/forms.html#h-17.5

将type="button"添加到按钮元素以阻止它发布表单。

为安全起见，您应始终指定按钮的类型。

Answer 2

我已经对它进行了测试并且工作正常......

<script>
      $(document).ready(function () {
            $("#button").click(function () {
              $('#inputid').focus();  
              //return false;     
            });
    });
    </script>

和

<form>
     <input type="text" id="inputid">
     <input id="button" type="button" value="Click"/>
 </form>

Answer 3

尝试使用这样的按钮：

 <button type="button">Click Me</button>

Answer 4

$(document).ready(function () {
    $("button").click(function (e) {
        e.preventDefault();

        $('#inputid').focus();
        return false;
    });
});

当您点击button.Form执行发布。

Answer 5

试试这种方式

 <form action="#">
     <input type="text" id="inputid">
     <button>Click Me</button>
 </form>

jquery不关注表单字段

5 个答案: