Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Web Development Articles
Page 698 of 801
What is an Event Object in jQuery?
The callback function takes a single parameter; when the handler is called the JavaScript event object will be passed through it.The event object is often unnecessary and the parameter is omitted, as sufficient context is usually available when the handler is bound to know exactly what needs to be done when the handler is triggered, however there are certain attributes which you would need to be accessed.Let us see an example of isDefaultPrevented() method. The isDefaultPrevented() method checks whether event.preventDefault() was ever called on this event object.ExampleYou can try to run the following code to learn how to work with ...
Read MoreHow to handle jQuery AJAX success event?
To handle jQuery AJAX success event, use the ajaxSuccess() method. The ajaxSuccess( callback ) method attaches a function to be executed whenever an AJAX request completes successfully. This is an Ajax Event.Here is the description of all the parameters used by this method −callback − The function to execute. The event object, XMLHttpRequest, and settings used for that request are passed as arguments to the callback.Let’s say we have the following HTML content in result.html −THIS IS RESULT...ExampleThe following is an example showing the usage of this method −Live Demo jQuery ajaxSuccess() method ...
Read MoreHow to toggle a div visibility using jQuery?
To toggle a div visibility in jQuery, use the toggle() method. It checks the div element for visibility i.e. the show() method if div is hidden. And hide() id the div element is visible. This eventually creates a toggle effect.The toggle( speed, [callback]) method toggles displaying each of the set of matched elements using a graceful animation and firing an optional callback after completion.Here is the description of all the parameters used by this method −speed − A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).callback − ...
Read MoreWhat is the difference between jQuery.show() and jQuery.hide()?
jQuery show() methodThe show( speed, [callback] ) method shows all matched elements using a graceful animation and firing an optional callback after completion.Here is the description of all the parameters used by this method −speed − A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).callback − This is optional parameter representing a function to call once the animation is complete.ExampleYou can try to run the following code to learn how to work with show() method: The jQuery Example ...
Read MoreRemove next element using jQuery?
To remove the next element in jQuery, use the remove().ExampleFollowing is the code − Document cancel(X) Demo cancel(X) Demo cancel(X) Demo $(".demo1").click(function () { $(this).parent().next("hr").remove(); $(this).parent().remove(); return false; }); To run the above program, save the file name “anyName.html(index.html)”. Right click on the file and select the option “Open with Live Server” in VSCode editor −OutputThis will produce the following output −Whenever you click the cancel(X), the jQuery will remove the element. This will produce the following output −
Read MoreHow to put url into a variable when button is clicked - jQuery?
For this, call a function on button click.ExampleFollowing is the code − Document ClickMeToCopyURL https://www.tutorialspoint.com/index/ function demoForCopyURL(e) { event.preventDefault(); var rootText = event.target.parentElement.innerText var btnText = event.target.innerText var originalURLValue = rootText.substring(btnText.length + 1) console.log("THE URL IS=" + originalURLValue) } To run the above program, save the file name “anyName.html(index.html)”. Right click on the file and select the option “Open with Live Server” in VSCode editor −OutputThis will produce the following output on console −On clicking the button, you will get the following output on console −
Read MoreOutput only the first word from select list value - jQuery?
Let’s say the following is our select − Get First Name Get First Name Only To get only the first word, use split() on the basis of space and can select the 0th index value.ExampleFollowing is the code − Document Get First Name Get First Name Only function showFirstValue(choosenObject) { var allValues = choosenObject.value.split(" "); var firstValue = allValues[0]; console.log("The first Name=" + firstValue); } To ...
Read MoreAccess the file contents from inside the callback function and display on console – jQuery
Let’s say the following is our file and we need to read this file using jQuery.The name of the file details −ExampleFollowing is the code − Document function chooseFile() { dataFromMyFile = document.getElementById("readFileDemo").files[0]; readDataFromFile = new FileReader(); readDataFromFile.onload = () => { data = readDataFromFile.result; console.log("Your File Data is="); console.log(data); }; readDataFromFile.readAsText(dataFromMyFile); } ...
Read MoreSet a fixed element and scroll another - jQuery
Let’s say the following is our fixed element div − Fixed The CSS style to fix the above element −.fixedElement { position: fixed; background-color: skyblue; top: 0; left: 0; right: 0; }Following is our element, which will be scrolled − David Miller Now, use the window.scrollTo().ExampleLet us see the complete code − Document .fixedElement { position: fixed; background-color: skyblue; top: 0; left: 0; right: 0; ...
Read MoreDisplay form values after clicking Submit button using event.preventdefault() - jQuery?
For this, use document.getElementById(“”) along with addEventListener().ExampleFollowing is the code − Document FirstName: LastName: const formDetails = document.getElementById("details"); formDetails.addEventListener("submit", async (ev) => { ev.preventDefault(); var fName = document.getElementById("firstName").value; var lName = document.getElementById("lastName").value; console.log("First Name=" + fName); ...
Read More