jquery-events | 易学教程

How to display progress bar until whole aspx page is load?

阅读更多关于 How to display progress bar until whole aspx page is load?

问题 I have a master page Root.master and a page default.aspx . I want to display progress bar until whole default.aspx page is loaded . I tried following code:- <html> <head><title>xx</title> </head> <body style="visibility:hidden;" onload="function(){document.body.visibility='visible'}"> <img src="xxxx.gif" style="visibility:visible !important"> </body> </html> But problem is that I do not have body on default.aspx , it is on root.master , if we put it on root.master, it apply all pages which

How to track change in textbox using jQuery

阅读更多关于 How to track change in textbox using jQuery

问题 I want to check if user changes the value of a textbox. If the user changes the value, then I want to display the changed value in a different textbox. 回答1: jquery has an event for this, .change(), this event will detect content changes when the textbox looses focus. If you are wanting to detect the change at every keypress, .keyup() and .keydown() might be better suited for your needs. Examples for your intended use: //just change '.change' to '.keyup' or '.keydown' the rest is the same. $(

How do I pass javascript events from one element to another?

阅读更多关于 How do I pass javascript events from one element to another?

问题 Setting up the stage: I have 2 layers one on top of the other. The bottom layer contains links (simple images), The top layer contains advanced tooltip like hovers for the bottom layer. These tooltips can be large (they can overlap onto other links easily, and almost always overlap the link they are tooltipping). My question: I'd like my mouseover events to occur on the bottom layer, and then on mouseover display the tooltip in the upper layer. This way as you move off of the bottom link the

How to trigger custom event with jQuery?

阅读更多关于 How to trigger custom event with jQuery?

问题 I'm attaching a custom event handler to the body in jQuery's ready method. Afterwards I immediately trigger the custom event but nothing seems to happen. $(function(){ $("body").on("test", function(){ alert("test triggered"); } $("body").trigger("test"); } 回答1: Firstly you have a syntax error $(function(){ $("body").on("test", function(){ alert("test triggered"); }); < ---- Missing this $("body").trigger("test"); }); Secondly you cannot trigger the event from the console , as $(function() {})

Get information about the source of an event with jQuery

阅读更多关于 Get information about the source of an event with jQuery

问题 A function is bound to an event for many objects. One of those objects fires the event and jQuery kicks in. How do I find out who fired the event inside the JavaScript function? I've tried using function [name](event){} and poking at event but I get "'data' is null or not an object". Here's my code right now: <script type="text/javascript"> $(document).ready(function() { $('.opening').bind("click", function(event) { //code to populate event.data since right now, the tags don't hold the info..

Javascript to Drag and Drop in HTML5

阅读更多关于 Javascript to Drag and Drop in HTML5

问题 Trying to do a simple drag and drop example in HTML5 - but when I drop the image into the div element I get the following error. Uncaught TypeError: Cannot set property 'innerHTML' of null So I assume the error message means dragElement is null. I don't understand why though, because I set it in the dragstart event to be the HTML of the img element. Anyone know how to make this work? var dragElement = null; $('#x').bind('dragstart', function (e) { dragElement = this; e.dataTransfer

Binding event to chosen select

阅读更多关于 Binding event to chosen select

问题 I have this code for a select box which is being displayed by the Chosen jQuery plugin. What I am trying to achieve is to get the value from the current item that has been selected: <div> <select id="schedule_event" name="schedule[event]" style="display: none; " class="chzn-done"><option value="Game" selected="selected">Game</option> <option value="Event">Event</option> <option value="Training">Training</option> </select> <div id="schedule_event_chzn" class="chzn-container chzn-container

Click event is not working

阅读更多关于 Click event is not working

问题 I have one problem with my code. The one click event doesn't work after another one. My ajax and jquery code is as below:  <script type="text/javascript"> $(document).ready(function() { $(document).on("click","button[class*=btnFound]", function(e){ var cijeliID = this.id.split("-"); var id = cijeliID[1]; $($("#confirmBox-"+id).data("target")).fadeIn(400); e

Restricting keyboard input with keypress jQuery

阅读更多关于 Restricting keyboard input with keypress jQuery

问题 I have a keypress function I created with a game to take user input in a form with the enter button (and to have a series of functions I defined first go in sequence on the Enter key being pressed). $(".form-control").keypress(function(event) { var keycode = (event.keyCode ? event.keyCode : event.which); if (keycode == 13) { var space = $(this).val().toLowerCase(); if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1)) { play(space); $(this).val(''); endGame(); return

Loading spinner gif image gets stuck

阅读更多关于 Loading spinner gif image gets stuck

问题 I have a 6kb animated gif loading spinner. when I open it in a browser window, it spins fine. But when it opens on an ajax call on my web page, it is stuck. It appears ontime and disappears ontime, but does not spin. Any ideas? Here is the jQuery code: $('#please-wait') .css("visibility", "visible")//.hide() .ajaxStart(function() { $(this).css("visibility", "visible"); }) .ajaxStop(function() { $(this).css("visibility", "hidden"); }); or $('#please-wait') .show() .ajaxStart(function() { $