gpt4 book ai didi

javascript - JavaScript 中的明文输入

转载 作者:行者123 更新时间:2023-12-02 14:09:24 26 4
gpt4 key购买 nike

我正在参加名为 JavaScript Tutorial 的在线类(class)。大约 1 小时 2 分钟后,我们即将结束类(class)的事件部分。最后一个事件是清除所有文本输入。我尽可能仔细地查看了视频中讲师的代码,但不明白为什么我的文字不清晰。下面是事件和它们引用的 HTML 标签。最后一个名为 clearInputs 的事件是我试图清除输入字段中的文本的事件。讲师让它看起来像是应该清除鼠标和按键输入。

<!doctype html>
<html lan="en">
<head>
<meta charset="utf-8">
<script src="jstut.js"></script>

<style type="text/css">
body {font-size: 1.6em;}
.hidden {display:none;}
.show {display:inLine !important;}
button {
border: 2px solid black; background: #ESE4E2;
font-size: .5em; font-weight: bold; color: black;
padding: .8em 2em;
margin-top: .4em;
}
</style>

</head>
<body>

<input type="text" id="randInput"
onChange="var dataEntered=document.getElementById('randInput').value;
alert('User Typed ' + dataEntered)"

<form action="#" id="sampForm">
<input id='charInput' type="text">

<p id="keyData">Key Data Here</p>

<input type="submit" value="Submit">
<input type="reset" value="Reset">

</form><br />

<img src="ntt-logo.png" id="logo">

<button id="logoButton" type='text'>Get Logo</button>

<input id='mouseInput' type='text' size="30"><br />

<button id="clearInputs">Clear Inputs</button>

<script>

// event.which returns the key or mouse button clicked

function getChar(event){
if(event.which == null){
return String.fromCharCode(event.keyCode); // for Internet Explorer
} else if (event.which != 0 && event.charCode != 0){
return String.fromCharCode(event.which); // for all other browsers
} else {
return null; // if user uses a key code that cannot be displayed on the screen
}
}

document.getElementById('charInput').onkeypress =
function(event){
var char = getChar(event || window.event)
if(!char) return false; // us user clicked something that doesn't work

// use innerHTML for html tag element id
// use value for input element

document.getElementById('keyData').innerHTML = char + " was clicked";
return true;
}

// .onfocus is when a field was clicked
document.getElementById('charInput').onfocus = function(event){
document.getElementById('keyData').innerHTML = "Input Gained Focus";
}

document.getElementById('charInput').onselect = function(event){
document.getElementById('keyData').innerHTML = "Text Selected";
}

document.getElementById('logoButton').onclick = function(event){
document.getElementById('logo').className = "show";
}

document.getElementById('logo').onclick = function(event){
document.getElementById('logo').className = "hidden";
}

document.getElementById('logo').onmouseover = function(event){
document.getElementById('logo').src = "ntt-logo-horz.png";
document.getElementById('mouseInput').value = "Mouse Over Image";
}

document.getElementById('logo').onmouseout = function(event){
document.getElementById('logo').src = "ntt-logo.png";
document.getElementById('mouseInput').value = "Back to Original Image";
}

document.getElementById('clearInputs').onclick = function(event){
var inputElements = document.getElementsByTagName('input');

for(var i = 0; i < inputElements.length; i++){
if(inputElements[i].type == "text"){
inputElements[i].value == "";
}
}
}
</script>
</body>
</html>

请帮我清除我的输入。谢谢!

最佳答案

您可以迭代输入并将值设置为空,如下所示:

document.getElementById('clearInputs').onclick = function(event){
var inputs = document.getElementsByTagName('input');
for (var i=0 ; i < inputs.length ; i++){
if (inputs[i].type == "text"){
inputs[i].value = "";
}
}
}
<input type="text"/>
<br/>
<input type="text"/>
<br/>
<button id="clearInputs">Clear</button>

关于javascript - JavaScript 中的明文输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39759681/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com