Question

我有一个类似下面的代码（称为index.php），带有多个提交按钮。我想在提交按钮上有不同的php动作。第一个按钮没有刷新浏览器的页面，当然还有传递变量。另一个具有正常操作，可以重定向到新页面（此处为form_submit.php）。我设法在this topic的帮助下使第一个按钮工作，但我无法区分第二个按钮和第一个按钮。有没有办法在这些按钮的功能之间切换？

<? php>
if($_POST['formSubmit'] == "Next") {
  $var1 = $_POST['name1'];
  $var2 = $_POST['name2'];.
  session_start();
  $_SESSION['variable1'] = $var1;
  $_SESSION['variable2']= $var2;
  header("Location: form_submit.php");
  exit;
}

?>
<html>
<body>
<form action="index.php" method="post">
<input type="text" name="name1" id="name1" maxlength="50" value="<?=$var1;?>" />
<input type="text" name="name2" id="name2" maxlength="50" value="<?=$var2;?>" />

<input type="submit" name="dataSubmit" value="Insert Data" />    
<input type="submit" name="formSubmit" value="Next" />

<script>

  $(function () {
    $('form').on('submit', function (e) {

      e.preventDefault();

      $.ajax({
        type: 'post',
        url: 'data_submit.php',
        data: $('form').serialize(),
      });

    });
  });
</script>
</form>
</body>
</html>

Answer 1

只要第一个按钮实际上不需要提交，您就可以设置＆＃39; onClick＆＃39;它上面的事件处理程序，只需按“按钮”即可。在这种情况下，当您按下按钮并且浏览器不提交表单时，将仅触发JS。这就是我的意思：

<input type="button" id="justButton" name="dataSubmit" value="Insert Data" />    
<input type="submit" name="formSubmit" value="Next" />

<script>

  $(function () {
    $('#justButton').on('click', function (e) {

      $.ajax({
        type: 'post',
        url: 'data_submit.php',
        data: $('form').serialize(),
      });

    });
  });
</script>

Answer 2

首先，将clicked类添加到按钮：

$('.submitButton').click(function(){
    $('.submitButton').removeClass('clicked');
    $(this).addClass('clicked');
});

比提交事件检查按钮：

$('form').submit(function(){
    var button = $('.submitButton.clicked');

    if (button.attr('id') == 'name1') {
        ...
    } else {
        ...
    }

    return false;
});

多个提交按钮与传递变量的不同操作

2 个答案: