Javascript .innerHTML 功能输出仅闪烁

我写了一个JS代码来查找字符串是否回文。但是输出只保持不到一秒钟，然后消失。我知道以前有人问过这种类型的问题，我尝试了说添加"return false"的解决方案，但它对我不起作用。

function palindrome(str) {
var str1 = str.split("");
var str2 = str1.reverse();
var str3 = str2.join("");
return str3;
}
function checkpalin() {
var x = document.getElementById("pform").value;
var st = palindrome(x);
var flag = st.localeCompare(x);
if (flag === 0)
document.getElementById('demo').innerHTML = "Given number  is a palindrome";
else
document.getElementById('demo').innerHTML = "Not palindrome";
return false;
}

<form>
Please enter a string:<br>
<input type="text" name="str" id="pform" onchange="return checkpalin()"><br>
</form>
<p id="demo"></p>

这是因为你把它放在一个形式中。试试这个

function palindrome(str) {
var str1 = str.split("");
var str2 = str1.reverse();
var str3 = str2.join("");
return str3;
}
function checkpalin() {
var x = document.getElementById("pform").value;
var st = palindrome(x);
var flag = st.localeCompare(x);
if (flag === 0)
document.getElementById('demo').innerHTML = "Given number  is a palindrome";
else
document.getElementById('demo').innerHTML = "Not palindrome";
return false;
}

<!DOCTYPE html>
<html>
<body>
Please enter a string:<br>
<input type="text" name="str" id="pform" onchange="return checkpalin()"><br>
<p id="demo"></p>
</body>
</html>

还可以使用oninput而不是onchange，以便在文本框中键入时对其进行更新。

function palindrome(str) {
var str1 = str.split("");
var str2 = str1.reverse();
var str3 = str2.join("");
return str3;
}
function checkpalin() {
var x = document.getElementById("pform").value;
var st = palindrome(x);
var flag = st.localeCompare(x);
if (flag === 0)
document.getElementById('demo').innerHTML = "Given number  is a palindrome";
else
document.getElementById('demo').innerHTML = "Not palindrome";
return false;
}

<!DOCTYPE html>
<html>
<body>
Please enter a string:<br>
<input type="text" name="str" id="pform" oninput="return checkpalin()"><br>
<p id="demo"></p>
</body>
</html>

在表单的单个字段中按 Enter 时的默认事件是提交表单。

在您的代码中，返回仅在提交事件上有意义。

只需防止提交时默认或删除表单标签

function palindrome(str) {
var str1 = str.split("");
var str2 = str1.reverse();
var str3 = str2.join("");
return str3;
}
document.getElementById("myForm").onsubmit = function(e) {
e.preventDefault();
var x = document.getElementById("pform").value;
var st = palindrome(x);
var flag = st.localeCompare(x);
document.getElementById('demo').innerHTML = flag ? "Not palindrome" : "Given string  is a palindrome";
}

<form id="myForm">
Please enter a string and hit enter:<br>
<input type="text" name="str" id="pform"><br>
</form>
<p id="demo"></p>

相关内容

最新更新

热门标签：