javascript - JQuery 函数submit()，用于当用户在 input=text 中按 Enter 时，还提交位于同一表单中的 input=submit

Question

所以我有一个包含两个输入的表单:一个input=text和一个input=submit。 输入文本用于更新项目的信息，输入提交用于删除项目。 用户编辑输入文本中的信息并按 Enter 键后，项目的信息将更新。我为此使用 JQuery，请参阅下面的代码:

JS文件中

  $(".input-edit").focus();
    $(".input-edit").keyup(function (event) {
    if (event.keyCode == 13) {
        $(currentEle).html($(".input-edit").val());
        this.form.submit();
        return false;
    }
});

它工作正常，但问题是:当用户按 Enter 键时，输入提交(删除按钮)也会提交，并且在更新信息后删除该项目。如何仅在用户按 Enter 键时提交更新？

HTML 表单 (index.php):

  <form action="crud.php" method="post">
      <input class="input-edit" name="editInfo" type="text" value="$item['info']" />
      <input type="hidden" name="id" value="<?php echo $item['id']?>">                

      <button class="btn" type="submit" name="delete">
          <i class="icon-deletar material-icons right">delete</i>
      </button>                            
  </form>

更新和删除的PHP代码(crud.php):

if(isset($_POST['editInfo'])){
    $info= trim($_POST['editInfo']);
    $id= $_POST['id'];

    if(!empty($info)){
        $query= $db->prepare("UPDATE item SET info = '$info' WHERE id = $id");
        $query->execute();
    }

}else if(isset($_POST['delete'])){

    $id= $_POST['id'];
    if(!empty($cod)){
        $query= $db->prepare("DELETE FROM item WHERE id = $id");
        $query->execute();
    }
}

Answer 1

我可能错误地认为您正在使用 bootstrap (因为您正在使用类 btn)？

无论如何，您可以将删除按钮更改为指向删除操作的链接。 (您需要替换 [url])这样，当您单击 Enter 时，它不会触发任何提交按钮。

index.php

<a class="btn" href="[url]?delete=true&id=<?php echo $item['id'] ?>">
    <i class="icon-deletar material-icons right">delete</i>
</a> 

crud.php

} else if (isset($_GET['delete'])){
    $id= $_GET['id'];
    if (!empty($cod)) {
        $query= $db->prepare("DELETE FROM item WHERE id = $id");
        $query->execute();
    }
}