的JavaScript

Question

这里我创建了反向字符串并将其设置为“p”标签，但是当我点击Button时，它将“p”中的值设置为秒，然后将其清除

问：我知道这是因为“形式”标签，但为什么会发生这种情况？的使用Javascript：

function abc()
{
var str=document.getElementById("srcString").value; 
document.getElementById("ans").innerHTML=str.split("").reverse().join("");;
}

HTML

<form method="GET">
<input type="text" id="srcString" placeholder="Enter something...">
<button onClick="abc()">click</button>
<p id="ans"></p>
<form>

Answer 1

我认为避免表单提交和页面重新加载的最简单方法是将按钮type设置为button而不是标准类型submit。的 jsFiddle

<form method="GET"> <input type="text" id="srcString" placeholder="Enter something..." /> <button type="button" onClick="abc()">click</button> <p id="ans"></p> <form>

Answer 2

我的猜测是，因为该方法是GET，它只是刷新页面，而是尝试POST

Answer 3

很可能你正在重新加载页面。尝试从你的abc函数返回false来取消提交表单。

Answer 4

使用onsubmit="return false;"

<form method="GET" onsubmit="return false;">
<input type="text" id="srcString" placeholder="Enter something...">
<button onClick="abc()">click</button>
<p id="ans"></p>
<form>

Answer 5

单击该按钮时，会设置<p>标记，但会提交表单，从而导致页面刷新。解决此问题的方法是取消表单提交。

将您的代码更改为：

<小时/>

的JavaScript

function abc() {
    var str = document.getElementById("srcString").value;
    document.getElementById("ans").innerHTML = str.split("").reverse().join("");
    return false; //return false to cancel form submit
}

HTML

<form method="GET">
    <input type="text" id="srcString" placeholder="Enter something...">
    <button onClick="return abc()">click</button>
    <p id="ans"></p>
<form>

Answer 6

添加按钮类型属性以避免页面重新加载和刷新问题。

<form>标签的问题是什么？</form>

6 个答案:

的JavaScript

HTML