Javascript 代码在控制台上工作,但在脚本上不工作
我的问题是,当在特定行上设置断点时,我的代码在控制台上工作,但当运行脚本或在任何其他行上设置断点时,我的代码不工作 我有一个带有键控侦听器的输入字段,即使使用粘贴的输入也会触发,因此我正在尝试开发一个解决方案,该解决方案可以识别粘贴的输入,并在执行此操作时删除键控侦听器 当我在删除keyup侦听器的行上设置断点时,代码在控制台中运行良好,但当我在页面上直接运行脚本或在任何其他行上使用断点时,代码都不起作用。我尝试了'DOMContentLoaded',window.load,检查“document.readyState”,移动变量和函数,但仍然没有任何效果Javascript 代码在控制台上工作,但在脚本上不工作,javascript,input,console,addeventlistener,keyup,Javascript,Input,Console,Addeventlistener,Keyup,我的问题是,当在特定行上设置断点时,我的代码在控制台上工作,但当运行脚本或在任何其他行上设置断点时,我的代码不工作 我有一个带有键控侦听器的输入字段,即使使用粘贴的输入也会触发,因此我正在尝试开发一个解决方案,该解决方案可以识别粘贴的输入,并在执行此操作时删除键控侦听器 当我在删除keyup侦听器的行上设置断点时,代码在控制台中运行良好,但当我在页面上直接运行脚本或在任何其他行上使用断点时,代码都不起作用。我尝试了'DOMContentLoaded',window.load,检查“documen
//Recognizes pasted inputs and calls to remove "Keyup" listener
searchInput.onpaste = function remove() {keyupListener();};
//Removes "Keyup" listener
function keyupListener() {
//Here's where it works when I set a Breakpoint
searchInput.removeEventListener('keyup', dynamicPagination);
}
// Keyup listener
searchInput.addEventListener('keyup', () => {
dynamicPagination();
});
searchButton.addEventListener('click', () => {
dynamicPagination();
});
代码不工作时的行为是,它不读取removeEventListener,并使用粘贴的输入启动keyup处理程序
我只对香草JS解决方案感兴趣 //识别粘贴的输入和调用以删除“Keyup”侦听器
//Recognizes pasted inputs and calls to remove "Keyup" listener
var pasted = false;
searchInput.onpaste = function() {pasted=true;};
// Keyup listener
searchInput.addEventListener('keyup', () => {
if(!pasted) dynamicPagination();
});
searchButton.addEventListener('click', () => {
if(!pasted) dynamicPagination();
});
//---------------------------------------------------------
Try the below code:-
//---------------------------------------------------------
<textarea rows=5 cols=50 id=inpt></textarea><button id=btn>buttonn</button>
<div id=dv></div>
<script>
(function(){
var pasted = false;
var searchInput = document.getElementById('inpt');
searchInput.onpaste = function() {pasted=true;};
// Keyup listener
searchInput.addEventListener('keyup', () => {
if(!pasted) dynamicPagination();
dv.innerHTML += "<BR>pasted: " + (++dynCnt);
pasted = false;
});
var searchButton = document.getElementById('btn');
searchButton.addEventListener('click', () => {
if(!pasted) dynamicPagination();
dv.innerHTML += "<BR>pasted= " + (++dynCnt);
pasted = false;
});
var dv = document.getElementById('dv');
dv.innerHTML = "";
var dynCnt = 0;
function dynamicPagination() {
dv.innerHTML += "<BR>dynamicPagination" + (++dynCnt);
}
})();
</script>
//---------------------------------------------------------
var-pasted=false;
searchInput.onpaste=function(){pasted=true;};
//键控侦听器
searchInput.addEventListener('keyup',()=>{
如果(!粘贴)dynamicPagination();
});
searchButton.addEventListener('单击',()=>{
如果(!粘贴)dynamicPagination();
});
//---------------------------------------------------------
请尝试以下代码:-
//---------------------------------------------------------
巴顿
(功能(){
var-pasted=false;
var searchInput=document.getElementById('inpt');
searchInput.onpaste=function(){pasted=true;};
//键控侦听器
searchInput.addEventListener('keyup',()=>{
如果(!粘贴)dynamicPagination();
dv.innerHTML++=“
粘贴:”+(++dynCnt);
粘贴=假;
});
var searchButton=document.getElementById('btn');
searchButton.addEventListener('单击',()=>{
如果(!粘贴)dynamicPagination();
dv.innerHTML++=”
pasted=“+(++dynCnt);
粘贴=假;
});
var dv=document.getElementById('dv');
dv.innerHTML=“”;
var-dynCnt=0;
函数dynamicPagination(){
dv.innerHTML++=“
动态拼音”+(++dynCnt);
}
})();
//---------------------------------------------------------
要删除特定的事件侦听器,必须传递对完全相同的函数的引用,而不是类似于现有处理程序的函数。您正在使用匿名=>
函数包装器创建事件侦听器。您是对的@Pointy。谢谢但是,修复这一问题会给我的代码带来其他问题,而这些问题不在这个代码段中(我不想让问题过多)。Shashank在下面给出的答案更接近于解决我的问题,但我必须澄清你是绝对正确的。这个解决方案是可行的,但我必须在解释器进入“keyup”处理程序后将粘贴的变量还原为false
,这样dynamicPagination
函数在启动“keyup”处理程序。我在那里添加了一个,如果(粘贴)粘贴=false,我返回到最初的问题。代码在控制台上运行良好,但在脚本上运行不正常。有什么想法吗?甚至更奇怪。有时行得通,有时不行。@shashank