Question

 <form action="index.php?page=checkin" method="post" name="regForm">
            Fullständiga namn: <input name="full_name" type="text" id="full_name" class="required"> 
    <br >
    Email: <input name="usr_email" type="text" id="usr_email3" class="required email"> 
    <br>
            Sex: <select name="sex"><option value="male">Kille</option><option value="female">Tjej</option></select>
   <input type="submit" id="t" value="CheckIn">
      <script>
   $("#t").click(function () {
$("#Next_2").toggle();
});
</script>
  <br>
  <div id="Next_2" style="display: none">
       Lösenord: <input name="pwd" type="password" class="required password" id="pwd"> <br>
            En gång till..
     <input name="pwd2" id="pwd2" class="required password" type="password" >

   <br>
          <input name="doRegister" type="submit" id="doRegister" value="Register">
    </div>
      </form>

我有这个表格。但我的问题是当我按下CheckIn切换其他两个表单元素时，它认为应该action =“index.php？page = checkin”，我希望它在下一个按钮（寄存器）上做，应该怎么做我这样做了吗？

Answer 1

您应该return false;来阻止按钮的默认行为。

$("#t").click(function () {
    $("#Next_2").toggle();
    return false;
});

或者，您可以致电event.preventDefault()：

$("#t").click(function ( event ) {
    event.preventDefault()
    $("#Next_2").toggle();
});

http://api.jquery.com/event.preventDefault/

不同之处在于return false;也会阻止事件冒泡。我不认为这是一个问题，所以任何一种方法都应该有用。

Answer 2

你应该改变这个：

<input type="submit" id="t" value="CheckIn">

对此：

<input type="button" id="t" value="CheckIn">

“submit”输入类型可以通过实现来提交它所包含的表单，因此单击它会强制浏览器这样做。

Answer 3

有两种方法可以解决它。

1）保持标记相同并更改脚本：

$("#t").click(function () {
    $("#Next_2").toggle();
    return false; // this will stop the button from continuing its regular event
});

2）虽然1.可以，但最好将标记更改为语义。拥有一个不提交的提交按钮是没有意义的。因此，在语义上更好地将提交按钮更改为常规按钮：

<button type="button" id="t">CheckIn</button>

这样您就不必更改脚本

了

jQuery：使用表单操作切换按钮问题

3 个答案: