document.querySelector更改事件？
document.querySelector是JavaScript中的一个方法，用于通过CSS选择器选择文档中的元素。它返回匹配选择器的第一个元素，如果没有匹配的元素，则返回null。
更改事件是指当元素的值或状态发生变化时触发的事件。可以通过document.querySelector方法选择要更改事件的元素，并为其添加事件监听器来处理更改事件。
例如，如果要为id为"myInput"的输入框添加更改事件监听器，可以使用以下代码：
const input = document.querySelector("#myInput");
input.addEventListener("change", function(event) {
// 处理更改事件的代码
});在上述代码中，querySelector方法选择了id为"myInput"的输入框，并为其添加了一个change事件监听器。当输入框的值发生变化时，事件监听器中的代码将被执行。
推荐的腾讯云相关产品和产品介绍链接地址：
- 云函数（Serverless）：https://cloud.tencent.com/product/scf
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云原生容器服务（TKE）：https://cloud.tencent.com/product/tke
- 云存储（COS）：https://cloud.tencent.com/product/cos
- 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ailab
- 物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iotexplorer
- 移动推送服务（信鸽）：https://cloud.tencent.com/product/tpns
- 区块链服务（BCS）：https://cloud.tencent.com/product/bcs
- 腾讯云游戏引擎（GSE）：https://cloud.tencent.com/product/gse
- 腾讯云直播（CSS）：https://cloud.tencent.com/product/css
相关·内容
function hidenv() {
var txt = document.querySelector(".wapf-grand-total")[0].innerText;
if (txt === "$260") {document.querySelector("button").style.display = "none";
}
}
hidenv();
<input class="wapf-grand-total">
<button>button<
浏览 1提问于2021-09-18得票数 0
回答已采纳
我有一个Google扩展，它从一个站点检索数据并将数据粘贴到另一个站点。
要从第一个站点获取数据，我使用以下代码：
$('#copy').click(function() {
var newClipboard = {
"name": $('#buyercontactname').val(),
}
chrome.runtime.sendMessage({newClipboard: newClipboard});
});
要将数据粘贴到另一个站点中，我使用以下代码：
$(document).ready(functi
浏览 0提问于2018-10-29得票数 4
回答已采纳
我已经添加了一个更改事件侦听器input[type='checkbox']元素，但是即使我在JS代码中包含了e.stopPropagation()，事件似乎一直一直到<li>元素上的单击侦听器。
我的HTML结构：
<li>
<label class="checkboxContainer">
<input type="checkbox">
<span class="checkmark"></span>
</label>
Lorem
浏览 2提问于2020-01-27得票数 5
回答已采纳
这对我来说有点神秘，但我相信有更多JS技术的人能够澄清这一点。有一个我使用的大型在线论坛网站。回到过去，我可以通过JS轻松地更改注释元素(textarea)。
document.querySelector("textarea").value = "foo"
然后我会按下保存按钮，无论是手动的还是脚本的，它都会像你期望的那样保存。
不久前，那个网站重新设计了他们的整个前端。现在，当我执行完全相同的操作时，更改将不会保存。激活更改操作的那一刻，原来的值就呈现出来了。
我的问题是他们是怎么做到的？如果是用户输入或更改值的脚本，它们如何区分？
textarea DOM元
浏览 4提问于2022-09-14得票数 0
我正在创建动态下拉列表，我想获取option.Since的名称，没有我们不能使用的值
document.querySelector('#hello').style.color=this.value;
所以--
<select id="hello">
<option>a</option>
<option>b</option>
</select>
<h1>HELLO</h1>
document.querySelecto
浏览 24提问于2018-08-30得票数 0
2回答
我试图构建一个非常简单的应用程序，它向一个包含输入产品upc信息的字段的站点显示一个upc视图。该应用程序的唯一原因是为我们的仓库员工提供内置条形码扫描仪功能。到目前为止，所有操作都很好，直到使用以下代码将扫描的条形码信息插入到textfield：
webView.evaluateJavaScript("document.activeElement.value='(text)'")
我遇到的问题是，我试图为表单编码，以便在扫描后立即提交/搜索。到目前为止，搜索按钮甚至没有显示为使用value属性似乎没有注册为文本输入。
我已经在网上搜索了好几个小时(也许是错误的
浏览 3提问于2021-04-12得票数 0
回答已采纳
1回答
我正在使用JSF2.2开发一个Java Web应用程序。我结合了另一种前端技术，但是我的具体问题很容易用下面的代码来解释：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Prueba</title>
</head>
<body>
<input id="test" value="Initial value" onchange="al
浏览 0提问于2017-10-25得票数 0
我尝试使用通过事件侦听器获得的用户输入，将其显示在页面上，并将值存储在一个数组中以供进一步使用。但是，该数组保持为空。有什么想法吗？
let arr = [];
function display() {
let p = document.querySelector('p');
let btn = document.querySelector('btn');
let input = document.querySelector('input').value;
btn.addEventListener('cli
浏览 1提问于2019-05-13得票数 0
2回答
当您更改nameDiv (即var nameDiv = document.createElement('div'); (nameDiv.contentEditable = "true";) )的内容时，应该更改表位置的内容，并且它有一些文本。
nameDiv.onclick = event => {
allSectionsArray[sectionNumber][2] = event.value;
}
这里所发生的基本上是:它更新我点击div的第二次，而不是在输入了一些文本之后。
我想要的是:在输入文本后保存更改。有任何替代的o
浏览 1提问于2022-07-12得票数 3
回答已采纳
1回答
function edit(id) {
let name = document.querySelector('#name');
let price = document.querySelector('#price');
name.value = products[id].name;
price.value = products[id].price;
document.querySelector(".update").addEventListener('click'
浏览 6提问于2021-05-28得票数 0
回答已采纳
我在select中有函数，但是我想在页面显示(Load)和值被更改时执行函数。实际上，只有在值发生更改时才会执行。
我的密码在这里：
function go(x) {
var text = x.options[x.selectedIndex].text;
var elements = document.querySelectorAll('.ppselect2');
elements.forEach(function(element) {
element.value = text;
});
};
<select class="dntsel
浏览 0提问于2018-03-07得票数 0
回答已采纳
使用rxjs 5，我希望订阅一个可观察对象，并从最后发出的值开始流。运算符'.cache‘应该是为此而构建的(我想)，但我无法让它工作。我做了一个小测试，触发一个可观察对象(通过单击一个按钮)，然后在3秒后订阅它。理论上，我应该在订阅时获得点击发射，但我没有。
let btn = document.querySelector(`btn`),
btn$ = Rx.Observable.fromEvent(btn, `click`)
.cache(1);
setTimeout(() => {
btn$.subscribe(evt =&
浏览 1提问于2016-05-06得票数 0
我目前正在进行自动化过程，这涉及到VBA和IE。通过我的代码正在执行的多个操作，一切都是最新的。问题是，当我接近一个部分，我有2个下拉列表，第二个出现后，某些选择是在第一个选择。
我为本节开发的代码部分相当粗糙，如下所示：
Dim dropY As Object
Set dropY = IE.Document.getelementbyid("selectedListType")
dropY.Focus
Application.SendKeys "{DOWN 4}"
Do While IE.Busy
Application.Wait DateAdd("s
浏览 0提问于2018-06-28得票数 1
回答已采纳
我有一个按钮元素和一个段落元素，我附加了一个eventListener (点击)事件，所以我想要的是，当我点击按钮时，段落的文本消失了，当我再次点击它时，同样的点击，我想让它出现，来回切换点击消失点击消失。 let button = document.querySelector("button");
button.addEventListener("click",function(e){
let p = document.querySelector("p");
p.style.display = "none";
this.ad
浏览 16提问于2019-10-13得票数 0
我正在做一个消息系统，最近我实现了一个文件上传器，我的javascript函数不工作，如果我按下输入文件按钮，然后按取消，下一次我上传一个文件时，它会这样做3次。这就好像因为我没有上传任何东西，他们只是坐在那里，然后函数堆栈。以下是我的输入：
<input type="file" id="file" onclick="bro()"name="file" value="FILE UPLOAD" style="opacity: 0;z-index: 100000; bottom: 17.5px; posi
浏览 0提问于2020-08-26得票数 1
2回答
我所处的情况是，我有一个外部JavaScript文件，用于进行ajax调用，并将某些数据保存到会话存储中。JavaScript文件从外部站点加载，因此我无法编辑它。
当数据加载到会话存储时，我需要运行一个函数来使用保存的数据。一旦加载这些数据，我如何触发一个函数？
浏览 7提问于2017-06-29得票数 0
我正在构建一个我个人使用的小型Chrome扩展。
在Facebook的广告管理器(使用React)中，我希望将文本区域字段的值更改为chrome扩展生成的值。
我试着用老办法这样做
document.querySelector('textarea').value = myValue;
这会改变屏幕上的值，但在chrome的inspect元素中，值不会改变，当我将焦点放在input元素上时，值会重置。
下面是react组件的外观：
下面是react组件属性和状态的图片：
在上面的组件中，我希望将state.displayValue更改为我的值。
如何做到这一点
浏览 2提问于2016-12-15得票数 16
2回答
我正在处理一个页面，其中一个元素('.item--itemprice')通过另一个我不希望接触的函数更新其文本。我想做的是让另一个元素('.header--itemprice')进行更新，以便它的文本与第一个元素相匹配。
不幸的是，下面的处理程序似乎比更新函数运行得更快。因此，标题要么保留在前一个文本中，要么更改为空白字符串。有没有办法延迟下面的最后一行，直到第一个元素完成更新？
$('select').on('change', function() {
const headPrice = document.querySel
浏览 1提问于2017-08-02得票数 1
1回答
我有以下HTML代码： <input id="number" type="number" value="1" min="1" max="10"> <a href="/products/add-to-cart/<%= products[i]["_id"] %>" class="btn btn-light">Add to cart</a> 此代码显示一个输入数字字段和一个链接到快递路线的按钮。 我的问题是，如何将输入字段中
浏览 33提问于2020-04-10得票数 0
第一次运行html之后，请注释存储本地存储值的行。然后在注释框中输入一些值，然后按enter。可以为列表中的第一项输入注释。如果你试图对下一个项目做同样的事情，它们就不起作用了。(除了第一个框之外，任何地方都不能输入注释。
JSBin -
浏览 3提问于2015-02-19得票数 0
回答已采纳
你好，我有一个提交数据的表单，我有两个字段，一个是选择菜单，另一个是文本字段，我试图根据从selct菜单中选择的选项填充我的文本字段，
例如，当我选择橙色作为选项时，我将圆圈作为文本字段中的值，
这是我的选择菜单
<form action="#">
<select name="selection">
<option value="Choose One"selected="selected">Choose One</option>
<opt
浏览 5提问于2014-09-04得票数 0
回答已采纳
我一直在研究胸罩大小的计算器，但是在运行这段代码时出现了addEventListener空错误。它在本地运行时很好，但当我部署它时，它会变得很疯狂。我甚至尝试将addEventListener放入bra_size_calculator函数中，但仍然给出了相同的错误。我不知道我错过了什么。
JS
window.onload = function () {
var bra_size_calculator = (function(){
var size_diff = {
1: 'A',
2: &
浏览 4提问于2021-06-25得票数 0
回答已采纳
我的网站上有个开机开关：
<div class="form-group">
<label class="checkbox-inline checkbox-right checkbox-switchery switchery-sm">
<input type="checkbox" class="switchery" id="test55">
Live
</label>
浏览 2提问于2017-06-22得票数 0
回答已采纳
1回答
我想要做的是在输入框中输入文本时立即显示它们，到目前为止，我的javascript函数根本不起作用，我只需要在文本框中输入或删除文本时显示该函数。
<!DOCTYPE html>
<html>
<head>
<link href="styles.css" rel="stylesheet">
</head>
<body>
<div class="output-box">
<P class="Output-text">
浏览 6提问于2021-10-19得票数 0
我目前正在构建一个购物清单应用程序，其中包含一个表单，输入框和提交按钮。我的目标是允许用户在表单中输入值，直到页面上列出了6个条目；当条目达到6个时，我想禁用该按钮，这样就不能添加更多的值了。但是，如果用户删除了一个项目(例如，列表降至5个项目)，我希望该按钮一直处于启用状态，直到它达到6个项目，然后再次继续相同的例程。
我尝试使用数组和"if else if语句“来指定条件，但这并不起作用。下面是我尝试过的JS代码。
let items = [];
let list = document.querySelector('ul');
let i
浏览 0提问于2019-10-06得票数 0
我在一个嵌入了各种下拉列表的section标签上注册了一个eventlistener：
function dropdownChange(e) {
window.console.log("The event is detected");
if (e.target.tagName === "SELECT")
window.console.log("The event's target is a dropdown"); // Some jobs
else
window.console.lo
浏览 0提问于2014-08-19得票数 3
1回答
我有这个html代码
<div class = "select">
<select class = "select-text">
<option disabled selected> Select user </option>
</select>
</div>
<button id = "oracle" class = "mdc-button"> Calculate BMI </button>
浏览 0提问于2019-05-08得票数 1
我想得到下面的结果，但不知道怎么做。
通过单击按钮将方框颜色变黄为红色。
单击红色框显示警报。
第一条适用于我的代码。但第二个不起作用。
有人能帮我吗？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.box {
width: 100px;
浏览 0提问于2019-07-04得票数 1
回答已采纳
我正在处理一个表单，只需要显示特定的输入时，选中了是，它works...but当我点击否元素保持存在。
const sharing = document.querySelector('.sharing');
const twoBeds = document.querySelector('.two-beds');
const shareInput = document.querySelector('#occupant_share');
const hotelShow = document.querySelector('#occupant_h
浏览 2提问于2019-09-11得票数 0
从这个页面，它显示了"10“条目。当我们在Chrome浏览器中使用Tamper猴子或Stylebot打开这个网站时，我们如何将其更改为"50“？
浏览 2提问于2018-09-28得票数 0
回答已采纳
2回答
是我创作的钢笔。
<div class = 'cc'>
<div class = 'bb'><div class = 'aa'> Some word </div></div>
</div>
CSS
.cc {
width: 100%;
min-height: 90px;
margin: 0;
padding: 0;
border: 1px solid #999999;
border-radius: 3px;
padding-left:
浏览 0提问于2019-08-10得票数 1
回答已采纳
我有两个装有文字的容器。我想要增加一个文本的文本大小悬停在另一个仅使用CSS。我在一个不同的岗位上看到的方法并不适合我。怎样才是正确的方法？提前谢谢。
.top p {
font-size: 3vw;
}
.bottom p {
cursor: pointer;
}
.bottom:hover + .top {
font-size: 6vw;
}
<div class='wrapper'>
<div class='top'>
<p>scale</p>
</div>
浏览 12提问于2022-07-05得票数 0
回答已采纳
最近我问我如何才能做到这在这个中是纯，但是我的客户需要在一个纯JS结构(而不是基于jQuery )中这样做，不要问我他为什么要这样做，所以我如何在select标记选项上做一个if why
因此，例如，如果我使用键盘或鼠标更改select标记选项中的值，我希望在目标select标记选项上执行一个if else选项，这里是我的代码，我需要它与键盘一起正常工作。
document.addEventListener('DOMContentLoaded',function(){
document.querySelector('#numbers').addEventL
浏览 1提问于2018-05-31得票数 0
回答已采纳
我想在滚动每个部分(div)进入视图时更改固定的背景图像。
当用户向下滚动时，背景图像应该淡出，反之亦然。图像是通过z-index叠加在另一个之上的，所以我只需要当到达该部分时将覆盖的图像淡出。
我目前只为第一个图像工作，但不知道如何触发其余的图像。
我对使用javascript很满意。这是我到目前为止所做的--它工作得很好--很好，很流畅。
$(window).scroll(function() {
$("#bg").css("opacity", 1 - $(window).scrollTop() / $("#bg").height()
浏览 0提问于2017-10-01得票数 0
我是个新手，我一直在寻找答案，但没有找到。
我开始是一名网页设计师/网页开发人员。
我在bootstrap中有一个图像的旋转木马，在它的顶部有一个div。这个div是页面的一个简单标题。
我想要更改颜色标题为一个特定的图像时，这是“活动”。我尝试过(因为我看到显示的图像将其类名："carousel-item“更改为："carousel-item active")，但不起作用。
这是我的HTML：
<div id="titulo">Game of thrones</div>
<div id="carou
浏览 0提问于2019-11-01得票数 0
3回答
我想添加一些项目到任务列表和禁用按钮每次。当页面加载时，它可以正常工作。
我也想在添加每个任务后禁用按钮。
如果您添加了一个新任务并按submit按钮，它可以正常工作。但是如果用户选择按下'Enter‘按钮而不是submit，它就会被启用。
如果用户喜欢“输入”按钮而不是“提交”按钮，那么禁用提交按钮应该做什么？
<!DOCTYPE html>
<html>
<head>
<script>
document.addEventListener('DOMContentLoaded'
浏览 1提问于2018-11-10得票数 0
回答已采纳
我目前正在学习JavaScript，我正在学习“你不认识js”系列书。
在本书的部分，在讨论命名函数表达式时，作者提到了。
如果函数没有名称，则如果函数需要引用自身、递归等，则不幸地需要不推荐的arguments.callee引用。另一个需要自引用的例子是事件处理程序函数在触发后想要解除绑定。
因为我在JavaScript相对缺乏经验，所以我不太确定什么是“事件处理程序函数解绑定”(我知道什么是“事件处理程序函数”)以及它是如何工作的。
所以我想知道是否有人能解释它，它到底能做什么？(一个代码示例会更好)。
浏览 3提问于2017-07-06得票数 3
回答已采纳
1回答
在Angular 8中，我可以这样做：
const el = document.querySelector("#first-name);
if (!el) { console.warn(item.selector, 'not found'); return; }
const probe = ng.probe(el);
const ref = probe.providerTokens.find(p => p.name === 'NgControl');
const directive = probe.injector.get(ref);
direct
浏览 0提问于2020-04-02得票数 2
我正在做一个游戏，可以由两个玩家玩，所以如果一个玩家完成了他的回合，相同的事件监听器应该连接到玩家拖拽，但它不是在两个玩家之间切换。 在我的代码中，我创建了一个变量'changeTurn‘，它存储玩家回合的布尔值，如果为真，则玩家一轮，如果为假，则玩家两轮。但在if condition true value为false的情况下，它仍然会执行不应该执行的'If(changeTurn === changeTurn )‘。有没有人能帮我一下，为什么会这样？ GAME RULES:
- The game has 2 players, playing in rounds
- In e
浏览 11提问于2019-03-18得票数 1
回答已采纳
1回答
好吧，在问这个问题之前，我确信在stackoverflow上已经有了这个问题的答案……但是我找不到任何东西，所以我这样说：
我正在使用flask创建一个网站。其中的一部分就是发表评论。
当我单击enter时，它应该提交表单以将注释添加到数据库。
下面是我的代码：
(这是表格)
<form method="POST">
{{ form.hidden_tag() }}
{% if form.comment.errors %}
{{ form.comment(id="comment-input", class="
浏览 0提问于2018-12-29得票数 0
是否可以存储元素中的所有事件侦听器，以便在克隆元素后检索该元素
//clone element makes event listeners stripped
var old_element=document.getElementById('dhtml_menu-1895');
// var el= alleventlistenersfrom this element
var new_element = old_element.cloneNode(true);
old_element.parentNode.replaceChild(new_element, old_
浏览 4提问于2016-01-13得票数 0
2回答
这是我的脚本中的一个奇怪的错误。
当我单击“测试”选项时，会出现alert。
但是，当我选择它(使用控制键)时，它不会alert。
作为测试，ctrl选择“桌面”，然后单击“测试”。你会看到没有警报：
为什么会这样呢？
联署材料：
var $cb = document.querySelector("#equipments");
$cb.addEventListener("change", function() {
if ($cb.value == "test") {
// if true
alert(&
浏览 11提问于2022-09-11得票数 0
使用JQuery，我可以对一个元素进行：
$('x').blur();
这是替换香草JS中的blur()调用的正确方法吗？
document.querySelector('x').dispatchEvent('blur');
浏览 1提问于2020-03-05得票数 0
回答已采纳
1回答
我有一个下面的HTML下拉列表。
<select name="custom_123" id="custom_123_123" class="custom form-control form-control-full form-select searchable abcd-done" style="display: none;">
<option value="" selected="selected">None</option>
<option value
浏览 2提问于2020-11-24得票数 0
我有一个bug，它看起来是由一个事件处理程序附加了一个click事件引起的：
mxpnl.track_links("#pagebody a", "Click.body");
我想看看该元素的事件处理程序是如何添加的(以及何时添加的)。
我在Chrome Debugger (Dev Tools) > Elements中找到了它，并在属性修改时选择了Break。调试器从不中断。
我还选择了它的父Div (它在其中)，并设置Debugger (右键单击元素)> break on subtree Parent。再说一次，它永远不会坏。
我在这里做错了什么？
浏览 1提问于2018-09-20得票数 2
在这个我正在构建的网页应用程序中，当你的分数达到6000点或更多时，我试图改变某个元素的背景色。它应该响应<input>元素的type = 'number'。我认为我是在正确的轨道上，但到目前为止，我无法让它工作(而且我不能百分之百肯定onchange是正确的事件类型)。
这是我现在得到的密码。
在html文件中：
<input type="number" id="scorePlayer1" value=0 readonly="true">
在联合来文中：
const scorePlayer1 = docu
浏览 6提问于2022-06-21得票数 1
回答已采纳
我试图让下拉菜单的用户图标更多地向左，而不是如何在屏幕下面的镜头，它是关闭的右边。另外，当页面最初加载时，下拉菜单将显示出来，而不需要用户单击。如何让它隐藏，直到我悬停或点击用户图标。这是一个css元素来解决这些问题吗？
@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Varela+Round");
nav.navbar.navbar-expand-lg {
background-color: var(--linq-color-gray-300);
bo
浏览 2提问于2022-10-11得票数 0
回答已采纳
2回答
标签里有个复选框。我将单击事件的事件侦听器添加到标签中，以便触发类。
当我单击复选框时，它确实有效。
但是，如果我单击标签，什么都不会改变。考虑到事件被绑定到标签而不是复选框，为什么会这样呢？
const formCheck = document.querySelector('.drinos-checker')
formCheck.addEventListener('click', function () {
formCheck.classList.toggle('checkerActive')
})
.checkerActive
浏览 9提问于2022-04-08得票数 3
回答已采纳
如何使此按钮在从输入中选择颜色后更改背景色？？
var theInput = document.getElementById("favColor");
var body = document.querySelector("body");
var theColor = theInput.value;
theInput.addEventListener("change", function() {
body.style.background = theInput.value;
}, false);
<form>
<
浏览 1提问于2017-06-30得票数 1
回答已采纳
我四处看看如何使用javascript从输入框中抓取文本，所有的帖子都说要使用.value，然而，我总是得到“未定义”。我认为问题在于，当我使用.value时，它会在输入标记中查找值=“”，而当它看到没有任何值时，就会返回“未定义”
我试图抓取用户所写的文本，并将其置于警报中。
HTML：
<input id='myText' type="text">
<input id = 'bot'type="button" value="Click Me">
联署材料：
var textValue =
浏览 0提问于2017-04-15得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
