javascript-events

问题 Let's say I have a simple list: <ul> <li class="notClicked">1</li> <li class="notClicked">2</li> <li class="notClicked">3</li> </ul> Can I onClick of one "li" change styles of all li 's except the one clicked? So if I click "li" number 2, then the list will look like: <ul> <li class="notClicked">1</li> <li class="clicked">2</li> <li class="notClicked">3</li> </ul> So if I click on first "li" then it will have clicked class, while others will be notClicked. In case you want to play with it,

问题 I'm trying to figure out how I can best attach a load event to an element, but be sure that it gets run. The issue comes when I bind to the load event of an img, but that binding happens too late and the image has already loaded. Is there some way in jQuery to check if the image is already loaded? Its obviously an intermittent issue, because sometimes the code is run before the image loads and sometimes its not. $(function () { var hasRun = false; $('#image').bind('load', function () { if ($

问题 As of post jQuery 1.7 the .live() and .bind() are deprecated and instead of that .on() is being used. Both of these were great functions were working like charm. What is purpose of removal? What is the technical reason behind that? And why .on() is proffered to use? 回答1: Quote from this article: You can’t use live for reusable widgets. stopPropagate() doesn’t work in live Live is slower Live isn’t chainable 来源： https://stackoverflow.com/questions/15924175/what-are-the-reasons-that-live-and

问题 Scenario I'm writing a web application, MVC in my case, and I need to update a specific container with the response from a get request, sometimes I want to filter the elements and find an element from the response to place in the original container. How can I do it? 回答1: I was building a web application when I needed to partially update my content asynchronously So I came up with a function which might suits your needs too. Basically it will perform a get request to the url provided, it has

问题 After some testing I'm noticing that event.stopImmediatePropagation() does not work in IE (per usage below). However, it works in Chrome, FF, Safari, and Opera. What gives? See this fiddle to repro in IE (test fiddle in other browsers to see it work). fiddle javascript: $(function(){ $('#text').focus(function(event){ $('#text').val('Use the button to test this.'); }); $('#button').click(function(event){ // remove all handlers $('#text').off('focus'); // now add this other handler in first

问题 I have some code that uses dispatchEvent to simulate clicks and the same exact code works fine in Chrome but doesn't work in Firefox. Here's the code: var evt = document.createEvent("MouseEvents"); evt.initEvent("click",true,true); jQuery("a:contains(Next)")[0].dispatchEvent(evt); I'm clicking on a link that loads another page and the page loads fine in Chrome but Firefox does absolutely nothing when I run this code in Firebug or even when I execute it as a bookmarklet. I've also tried the

问题 This question already has answers here : What values can a constructor return to avoid returning this? (6 answers) Closed 3 years ago . Consider the following code: function Foo() { return "something"; } var foo = new Foo(); According to the experts in JavaScript, they say that return "nothing" or just "this" from a constructor. Whats the reason for this? I am aware that when used "new", the "this" would be set to the prototype object of the constructor but not able to understand this point

问题 There are 24 div-objects waiting/listening for a mouse-click. After click on one div-object, I want to remove the EventListener from all 24 div-objects. for (var i=1;i<=24;i++){ document.getElementById('div'+i).addEventListener('click',function(event){ for (var z=1;z<=24;z++){ document.getElementById('div'+z).removeEventListener()//Problem lies here } //Some other code to be run after mouseclick },false); } The problem is that the removeEventListener is nested in addEventListener and I need

问题 I need to pass a message (raise an event) in a Chrome extension, and have JavaScript on a webpage react to it. In content_script.js of the extension, there should be a function like raiseXYZevent(data); JavaScript on the webpage http://foo.com/mypage.html should execute a handler function processXYZevent(data) { ... } The problem is that content script within an extension cannot interact with JavaScript on the webpage directly (it can only modify DOM). Is there a way to make DOM changes from

问题 I need to pass a message (raise an event) in a Chrome extension, and have JavaScript on a webpage react to it. In content_script.js of the extension, there should be a function like raiseXYZevent(data); JavaScript on the webpage http://foo.com/mypage.html should execute a handler function processXYZevent(data) { ... } The problem is that content script within an extension cannot interact with JavaScript on the webpage directly (it can only modify DOM). Is there a way to make DOM changes from