Question

我有一个页面，您可以在一系列texbox（从php生成）和2个按钮GetData和SaveData中输入数据。我希望能够在编辑texbox时按Enter键，它将执行与单击SaveData按钮相同的操作（onclick =“onSave（）;”）。我可以通过以下方式实现这一目标：

<form id="editForm" name="editForm" action="onSave();">

但是当我按回车键时，页面被重定向到页面，没有php帖子（例如：www.mypage.com/index.php，而不是www.mypage.com/index.php?edit_data=true ）

我如何实现我的目标？

Answer 1

试 <form id="editForm" name="editForm" action="onSave();return false;">

Answer 2

确保您的onSave();返回false，并将操作更改为onsubmit="return onSave();"。

Answer 3

答案是（感谢尤利西斯的答案部分）：

<form id="editForm" name="editForm" onsubmit="onSave();return false;">

我的onSave（）;函数确实返回false，但由于它正在进行重定向，所以我必须在onSave（）之后将返回false设置为false; （解释原因??）

谢谢！

Answer 4

嗯...你有意忘记了标签方法=“POST”吗？：）

Answer 5

button1作为提交按钮
button2 as type ='button'on cliking button2调用javascript函数，使用window.location.href =“www.mypage.com/index.php?edit_data=true”

Answer 6

没有这些提议的解决方案在使用PHP表单时对我有用。

基本上，我想要做的是有一个简单的表单，在提交后隐藏。我使用jQuery来监听点击发生的时间，但这并不重要，因为页面刷新了。然后，我使用JS来阻止提交的默认行为（例如e.preventDefault();）。我想出了什么......

我最终将表单操作设置为“＃”，以便在提交表单后更改URL。 Javascript读取哈希的URL并隐藏/显示必要的元素，然后在几秒钟后重定向（如果存在）。 是的，页面仍然刷新，但我通过使用带有页面刷新功能的JS来获得正确的行为。

这是我的代码：

<?php
include_once 'db.php'; // includes login to DB
if('POST' === $_SERVER['REQUEST_METHOD'] && isset($_POST['submit']))
{
  $ip = $_POST['publicIP'];

  $sql_query = "INSERT INTO tablename(PublicIP) VALUES('$ip')";
  mysql_query($sql_query);
}

?>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="noindex, nofollow">

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>

<script>var publicIP = '<?php echo $_SERVER['REMOTE_ADDR']; ?>';</script>

<style>
form, [type="submit"] {
  max-width: 300px;
  margin: 0 auto;
}
form {
  border: 4px solid #757679;
  border-radius: 5px;
  box-shadow: 4px 4px 4px #A5A5A5;
}
[type="submit"] {
  border: none;
  height: 5em;
  width: 100%;
  font-size: 2em;
  color: #353638;
  background-color: #22D1F2;
  text-shadow: -1px -1px 1px #949494;
}
input[name="publicIP"] {
  display: none;
}
p { text-align: center; }

p, form {
  -webkit-transition: all 2s;
  -moz-transition: all 2s;
  -ms-transition: all 2s;
  -o-transition: all 2s
  transition: all 2s;
}
.hidden { 
  display: none !important; 
  -webkit-transition: all 2s;
  -moz-transition: all 2s;
  -ms-transition: all 2s;
  -o-transition: all 2s
  transition: all 2s;
}
</style>
</head>
<body>

<p class="hidden">Thank you for visiting. You will be redirected within 3 seconds.</p>

<form action="#" method="POST">
  <input type="text" name="publicIP">
  <button type="submit" name="submit" value="Submit">Submit</button>
</form>

<script>
document.querySelector('input[name=publicIP]').value = publicIP;
</script>

<script>
function redirect() {
  setTimeout(function() {
    window.location = "https://google.com";
  }, 3000);
}
if (window.top.location.href.indexOf('#') > 0) {
  $('form').addClass('hidden');
  $('p').removeClass('hidden');
  redirect();
}
</script>

</body>
</html>

使用javascript阻止表单从重定向/刷新提交

6 个答案: