Question

我在<a>标签中有此按钮（想将其保留在标签中）。

<center><a href="javascript:changePassword()" type="button" id="box_button" class="pw-button">Change Password</a></center>

问题是，当我按Enter键时，密码被更改，不幸的是，页面重新加载，当涉及到UX时，这将非常烦人。那么，我该如何解决呢？

编辑：

好吧，我弄清楚，问题不在于按钮，而在于输入。

这里的代码：

<div id="login-box-field"><input type="password"  id="new_password" placeholder="Password: " class="form-login myLink" title="Password"  maxlength="20">
  
</div>

好吧，有人说了有关Form和JS脚本的事情。拜托，你能告诉我该怎么做吗？该平台上的其他一些示例不起作用:(

Answer 1

您可以使用jquery阻止a的默认操作（如果您不想更改html）：

    $("a").click(function(event){
     event.preventDefault();
    });

更新：：如果单击密码输入结果是页面刷新，则需要编辑该输入所调用的功能，因此请编辑该功能以返回false。

Answer 2

用按钮替换锚标记并添加onclick（）事件，然后调用change passwaord方法，它将正常工作！

<div>
<center><button onclick="changePassword()" id="box_button" class="pw-button">Change Password</button></center></div>
<script>
function changePassword() {
alert("your code goes here")
}</script>

fiddle is here

Answer 3

要防止重新加载页面，可以在函数内使用 e.preventDefault（）。

查看以下内容：https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault

示例：我的HTML：

<a href="https://google.com" class="myLink">Click me</a>

JS代码：

var myLink = document.querySelector('.myLink')
myLink.addEventListener('click', function(e) {
  e.preventDefault()
})

Answer 4

您需要使用event.preventDefault()阻止链接的默认操作。要阻止链接执行任何操作，应忽略href属性，或为href或等效的javascript:void(0)赋予javascript:;并使用onClick事件处理程序执行逻辑。

<center><a href="javascript:;" onClick="changePassword(event)" type="button" id="box_button" class="pw-button">Change Password</a></center>
<script>
function changePassword(e){
e.preventDefault();
console.log("Changing password");
//other logic
}
</script>

Answer 5

所有人。

我找到了适合我的解决方案：

<input class="tableInput" type="text" value="Table input" onkeypress="return tableInputKeyPress(event)" />

<script type="text/javascript">
function tableInputKeyPress(e){
  e=e||window.event;
  var key = e.keyCode;
  if(key==13) //Enter
  {
     //do you task here...
     return true; //return true to submit, false to do nothing
  }
}
</script>

再次，非常感谢发布解决方案的所有人：）

避免使用链接重新加载Java页面

5 个答案: