Tag: 事件监听器

jQuery / javaScript – click / onclick事件监听器尽管关闭但在循环内部无效: 我和我的循环再次…我正在尝试在几个div运行for循环，每个div都在类“ tooltipBox ”中但具有不同的id 。在每个div都有一个带有类“ tttFalloutOrder ”的输入文本字段。我想在for循环中做的是在每个.tttFalloutOrder输入字段上附加一个click-event-listener。到目前为止这是我的代码： function installListener(elementId) { $( “div#” + elementId + ” > .tttFalloutOrder” ).on(“click”, function() { alert(“clicked on ” + elementId); }); } function runSimulation() { alert(“running simulation…”); $( “#lContent h2” ).html(“Simulation in progress…”); var agents = $( “div.tooltipBox” ); var rFOs = $( “.rFO” ); var i, […]

需要.llick的eventlistener，以便动态刷新的按钮可以工作，但是操作会成倍增加: 如果我对数据库进行更改，我有一个页面，其中一个div：s内容（不是整个页面）刷新/重新加载/更新。此内容包含一个包含一些文本和按钮的行的表。由于我需要按钮仍然可以使用.click，我添加了一个eventListeners。问题是，我第一次按下这个div中的一个按钮时应该如此，但是每次按下其中一个按钮时，动作就会增加。这就像有太多的eventListeners。但我需要创建它们，以便每个按钮都可以点击。你怎么解决这个问题？我的大脑告诉我，我需要删除其他的eventListeners（因为每次点击都会创建一个，对吧？）然后触发一个新的。但我不知道该怎么做。我的代码看起来像下面的代码。所以我第一次按’编辑’我得到一个’你好’警报，第二次我得到两个’你好’警报，第三次我得到三个’你好’警报……等等 HTML <?php // Loop Through Database { echo 'Some Info’; echo ‘Edit’; } ?> JS $(document).ready(function(){ var setupEventListener { $(‘.edit-button’).click(function(e){ e.preventDefault(); someFunction(); }); } function someFunction(){ // update database with ajax and on success: alert(‘hello’); $(‘.div-to-reload’).load(document.URL + ‘ .div-to-reload’, setupEventListeners); } setupEventListener(); });

jQuery UI可拖动分屏: 我有一个在桌面上工作正常的分屏滑块但我需要jQuery UI才能在移动设备上工作。可拖动的事件让我来回拖动它但有时左边的图像从它的原始位置移动，或者完全消失。关于如何处理这个的任何想法？这是codepen 。滑块错误在移动设备上更明显。 document.addEventListener(‘DOMContentLoaded’, function(){ let wrapper = document.getElementById(‘wrapper’); let topLayer = wrapper.querySelector(‘.top’); let handle = wrapper.querySelector(‘.handle’); let skew = 0; let delta = 0; if(wrapper.className.indexOf(‘skewed’) != -1){ skew = 1000; } wrapper.addEventListener(‘mousemove’, function(e){ delta = (e.clientX – window.innerWidth / 2) * 0.5; handle.style.left = e.clientX + delta + ‘px’; topLayer.style.width= e.clientX […]

jQuery插件：处理事件: 我正在研究一个jQuery插件，我想知道是否有可能让插件监听事件而不是被事件触发。所以不是这样的： $(‘#element_id’).mouseover(function() { $(this).plugin(); }); $(‘#element_id’).mouseout(function() { $(this).pluginHide(); }); 我想尝试做这样的事情： $(‘#element_id’).plugin(????, ????); 并将？替换为对应该触发它显示或隐藏的元素和事件的某种引用。我仍然对jQuery感到厌烦，所以如果解决这个问题很明显，请耐心等待。

使用事件侦听器时维护’this’的值: 我有以下function： onDocumentKeyUp: function (e) { if (e.keyCode === 27) { this.deactivate(); } } 我想像这样绑定它： $(document).on(‘keyup’, onDocumentKeyUp); 但是，当我这样做时， onDocumentKeyUp函数内的onDocumentKeyUp引用文档。我这样解决了这个问题： var self = this; $(document).on(‘keyup’, function(e) { self.onDocumentKeyUp(e); }); 这有效，但有些东西告诉我有一个更清洁的方法来解决这个问题。将.apply() .call()或.apply()某种方式……应用于此处吗？我仍然不确定这些function是如何工作的。另外，我不一定要把自己限制在jQuery.on() 。如果有一种“香草”的方式，请做我的客人教我。

传递参数时，事件侦听器过早触发: 我将一些参数传递给javascript函数，该函数构建一个供用户填写的表单。这些参数中包含另外两个函数，这些函数包含在一个单独的类中，用于处理表单的保存或取消。 cancel函数需要两个参数，用于确定要构建的实体列表。问题在于参数。在表单构建function中，如果我将取消function附加到新创建的取消按钮而不给它任何参数，则function按钮工作正常但由于缺少参数而构建空列表。但是，如果我使用参数附加函数，则在创建页面时，函数会立即触发，而不是在单击按钮时触发。我尝试以几种不同的方式附加监听器，包括javascript，jquery甚至yahoo.util。在其他实例中使用参数调用时，取消函数中的所有内容都能正常工作。关于为什么函数在参数传递时会提前触发的想法？这里有一些不同方式的sudo代码，我已经连接了偶数监听器。 function buildform(formData, saveFunction, CancelFunction, p1, p2){ $(“#cancelButton”).live(“click”, cancelFunction(p1, p2); YAHOO.util.Event.on(“cancelButton”, “click”, cancelFuntion(p1, p2)); cancelButton.setAttribute(“onClick”,cancelFunction(p1, p2); }

使用jQuery的CSS3转换事件监听器: 我正在对article元素实现CSS3过渡效果，但事件监听器transitionend仅适用于纯JavaScript，而不适用于jQuery。见下面的例子： // this works this.parentNode.addEventListener( ‘transitionend’, function() {alert(“1”); }, true); // this does not work $(this).parent().addEventListener( ‘transitionend’, function() {alert(“1”); }, true); 有人可以解释一下我做错了什么吗？