dom-events | 易学教程

.preventDefault() not working in on.('input', function{})

阅读更多关于 .preventDefault() not working in on.('input', function{})

问题 I would like to limit number of chars in my editable div to 10. After user reach the limit I would like to use .preventDefault() method to protect the div from additional chars. Can You help me out, please? JSFiddle https://jsfiddle.net/7x2dfgx6/1/ HTML <div class="profileInfo" id="About" style="border:solid;" contenteditable="true">OOOOO</div> JQuery jQuery(document).ready(function($){ const limit = 10; rem = limit - $('#About').text().length; $("#counter").append("You have <strong>" + rem +

Capturing onkeydown in Javascript

阅读更多关于 Capturing onkeydown in Javascript

问题 I have a web front-end to an AS/400 CGI application which allows the use of some of the F1 - F24 keys (depending on the page) as well as page-up, page-down etc - these are passed to the underlying application which handles them appropriately. For instance, on a given page, a user could either press the F3 button or press the F3 key - both of them will set the (hidden) CmdKey variable to have a name of '_K03' and a value of 'F03'. The button handling is simple and has no problems. To handle

Lightweight library for cross-browser event support [closed]

阅读更多关于 Lightweight library for cross-browser event support [closed]

问题 Closed. This question is off-topic. It is not currently accepting answers. Want to improve this question? Update the question so it's on-topic for Stack Overflow. Closed 4 months ago . Cross-browser handling is quite a hassle sometimes. In this case I need to capture quite a number of events, but cannot afford to use a multi purpose library that exceeds 10ish Kb . (e.g. jQuery, Prototype, Dojo, YUI, ...) The script is meant as a basic tracking tool for various sites I'm maintaining. Every

Server Sent Event not working in Google Chrome

阅读更多关于 Server Sent Event not working in Google Chrome

问题 This is my server JSP code "Server_Date.jsp" <% response.setHeader("cache-control", "no-cache"); response.setContentType("text/event-stream"); out.print("data: " + (new java.util.Date()).toString() + "x\n\n"); out.flush(); %> This my client jsp page "Client_Serverdate.jsp" <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv=

'onmousedrag' event js

阅读更多关于 'onmousedrag' event js

问题 I have some code that works each time onmouseclick and continuously onmousemove when I set them accordingly. I am looking for a way to combine the two (i.e. like a click and drag) which I thought would be a simple task but cannot find any simple explanation. The closest I get is drag-and-drop tutorials. Do I have to call the onmousemove event while the onmouseclick event is triggered? Or is there something really simple I am completely overlooking? 回答1: You might want to just use a flag like

How to modify the value of v-model property via custom directive?

阅读更多关于 How to modify the value of v-model property via custom directive?

问题 When I use custom directive to change component's value, there is not effect: Vue.directive('maxchars', { bind(el, binding, vnode) { let maxChars = binding.value; let handler = function(e) { if (e.target.value.length > maxChars) { e.target.value = e.target.value.substr(0, maxChars) } } el.addEventListener('input', handler); } }); let app = new Vue({ el: '#app', data() { return { content: '', totalCount: 140 } } }) <script src="https://unpkg.com/vue@2.5.16/dist/vue.js"></script> <div id='app'>

Removing event listeners as Class.prototype functions

阅读更多关于 Removing event listeners as Class.prototype functions

问题 I'm trying to have a Class.prototype based classes in my project, where I don't have inline functions. Considering this example, it's impossible to remove the eventListener on myVideo video object, that I have in my class. This is a theoretical example, not an actual production code I have. var myClass = function () { this.initialize(); } MyClass.prototype.myVideo = null; MyClass.prototype.initialize = function () { this.myVideo = document.getElementById("myVideo"); this.myVideo

document.readyState on DOMContentLoaded?

阅读更多关于 document.readyState on DOMContentLoaded?

问题 In browsers that support the event DOMContentLoaded and the property document.readyState : When DOMContentLoaded fires, can I assume that the value of document.readyState will always be either "complete" or "interactive" /"loaded"? (Or could it be that document.readyState sometimes still has the value "loading" ?) In your answer please provide a reference to an authoritative source. You may wonder: Why not just listen to readystatechange ? It is because the Android 2.3.5 standard browser is a

Add onClick event to a group element (svg) with react

阅读更多关于 Add onClick event to a group element (svg) with react

问题 I'm trying to add an onClick event to an existing svg. Right now I have this : <g id="Group" onClick={this.clickGroup.bind(this, 1)}> Which somewhat works but not entirely... The event fires when I click the group but the "zone" that is clickable isn't the same as the group I want to be clickable (it seems completely random to me). Is there any better way to add events to a <g> element (with React ?) ? 回答1: A g element is just an empty container; it can not fire events by itself. If you run

How to detect Javascript execution in WebBrowser control

阅读更多关于 How to detect Javascript execution in WebBrowser control

问题 I have a WebBrowser control in my C# application. The web browser is under the user's control, that is, he can load any web page his computer can access on the web (of course limited by proxy, hosts file and so on). I need to know and to be notified when there is a Javascript call inside the page loaded in the web browser component. First example: given a link like this <a href="javascript:void(0)" onclick="jsFunct();">test</a> When the user clicks the link I need to know that the function