用户输入后清除文本区域的JavaScript
我正在尝试创建一个HTML表单,它由标题、文本区域、post按钮和clear按钮组成。我的目标是在用户单击“清除”按钮时清除文本区域,但在此之前会出现一个警告,询问用户是否确定要清除文本。如果用户键入OK,则要删除的文本区域;如果用户键入Cancel,则要取消的方法 我尝试了下面的代码,但是我注意到,无论我输入什么,或者按下什么按钮,文本区域中的文本都会在默认情况下被删除。我如何防止这种情况发生,从而使其发挥作用用户输入后清除文本区域的JavaScript,javascript,html,function,textarea,prompt,Javascript,Html,Function,Textarea,Prompt,我正在尝试创建一个HTML表单,它由标题、文本区域、post按钮和clear按钮组成。我的目标是在用户单击“清除”按钮时清除文本区域,但在此之前会出现一个警告,询问用户是否确定要清除文本。如果用户键入OK,则要删除的文本区域;如果用户键入Cancel,则要取消的方法 我尝试了下面的代码,但是我注意到,无论我输入什么,或者按下什么按钮,文本区域中的文本都会在默认情况下被删除。我如何防止这种情况发生,从而使其发挥作用 <!DOCTYPE html> <html> <
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<link rel="stylesheet" href="global.css">
</head>
<body>
<form >
<input type="text" id="title" name="title">
<textarea id="blog_textarea" name="blog" placeholder="Your Text">
</textarea>
<br><button type="submit" id="post" name="submission" value="Submit">Post</button>
<button id="clear_button" onclick="clearFun()" >Clear</button>
</form>
<p id="demo"></p>
<script>
function clearFun() {
var par_output="";
var txt = prompt("To confirm, please type OK, or to stay type Cancel ");
if (txt == "OK" || "ok") {
document.getElementById("blog_textarea").value = "";
} else {
par_output = "Please type OK to confirm or Cancel";
}
document.getElementById("par_output").innerHTML = demo;
}
</script>
</body>
</html>
职位
清楚的
函数clearFun(){
var par_输出=”;
var txt=提示(“要确认,请键入OK,或要保留,请键入Cancel”);
如果(txt==“正常”| |“正常”){
document.getElementById(“blog_textarea”).value=“”;
}否则{
par_output=“请键入OK确认或取消”;
}
document.getElementById(“par_输出”).innerHTML=demo;
}
如果有帮助的话
非常感谢各位您需要分别编写这两个条件,并且表单标签也可以清除它
if (txt == "OK" ||txt == "ok")
这应该起作用:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<textarea id="textarea"></textarea>
<br />
<button id="clearbutton">Clear</button>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$('#clearbutton').click(async () => {
const clear = await prompt('Clear? Type ok');
if (clear.toLowerCase() === 'ok') {
$('#textarea').val('');
}
});
</script>
</body>
</html>
文件
清楚的
$('#clearbutton')。单击(异步()=>{
常量清除=等待提示(“清除?键入ok”);
if(清除.toLowerCase()='ok'){
$('#textarea').val('');
}
});
在纯JavaScript中:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<textarea id="textarea"></textarea>
<br />
<button id="clearbutton">Clear</button>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
document
.getElementById('clearbutton')
.addEventListener('click', async () => {
const clear = await prompt('Clear? Type ok');
if (clear.toLowerCase() === 'ok') {
document.getElementById('textarea').value = '';
}
});
</script>
</body>
</html>
文件
清楚的
文件
.getElementById('clearbutton')
.addEventListener('click',async()=>{
常量清除=等待提示(“清除?键入ok”);
if(清除.toLowerCase()='ok'){
document.getElementById('textarea')。值=“”;
}
});
如果(txt==“OK”| | txt==“OK”){
(您需要完整地陈述每个条件,或者JS将“OK”
计算为true,这使得表达式无论txt
的值如何都为true)谢谢,我编辑了它,但是不管我在提示符中输入什么,文本区域都会被清除,这可能是因为单击
中的按钮将提交表单,这将有效地重新加载页面(从而“清除”文本区域)。请看这里:我在jQuery中检查了这一点,它似乎可以工作,您是否有可能在纯javascript中显示与我使用的代码相同的代码,但在jQuery中不太好?当然,我为您添加了它!