scroll/jump to anchor on another page query
Is it posible to scroll/jump to an anchor tag on another page and add some padding so the achor is not against the top of the screen leaving some space between the top of the screen and whatever is after the anchor tag? the -- line is the top of the browser's window and normally when you use page.html#title you get somehting like ------------------------------------------------------------------------------------------------ TITLE Donec porttitor libero convallis, dapibus lacus ac, viverra urna.
nextAll() BUT including simple text as well?
Assume the following source structure: <div> aaa <br> bbb <b>mytitle1234</b> ccc <br> <h3> h3headline</h3> ddd <br> eee <br> </div> lineoutside Now I want (simplified) to change the font size of all text which follows "<b>mytitle1234</b>" but only on the same hierarchy level. If I code $("b:contains('mytitle1234')").nextAll()...... then the fontsize of only the <h3> element will be changed. But I want to change "ccc" "ddd" "eee" as well (but not "lineoutside"). How can I achieve this? Peter
Adding QUnit.config properties to toolbar
It would be great to cleanly add other QUnit.config Boolean settings to the toolbar 1) Currently I delete QUnit.config.requireExpects; before using QUnit.config.urlConfig.push(); to add that option to the UI. This is based on what I see in qunit-2.3.2,js at line 2897 (QUnit.begin). 2) Adding QUnit.config.collapse to the UI causes a page reload which would be difficult to avoid. This is based on what I see in qunit-2.3.2.js at line 3132 (toolbarChanged).
API can only be initiated by a user gesture event handler
Hi, I am trying to play an html5 audio in a vmousedown handler in chrome on Android, but it says "API can only be initiated by a user gesture event handler". The issue is, obviously, that I am doing in an event handler and responding to a user gesture. The code is like below: <a id="btn1" data-role="button" data-inline="true" data-mini="true">Play</a> <audio class="audio" id="audio1"></audio> <script > $("btn1").on("vmousedown", function() { var a = $("audio1")[0]; a.play(); }); </script> Any idea?
Jquery to count words, img,videos and get duration?
Im doing a task that I need to go to a url with an article on it. Count words,img and videos in the main article only. PLUS get video duration. The article page is different every time so I need to first guess which tags are it. I was thinking the logic would be. Find content between each tag. Whichever innerhtml has the most characters in it thats the main article. So count words,img,and videos between those 2 tags. get video duration-i dunno. Is all this even possible? <p>ABC</p> <p>ABCDEF</p>
replace string characters using an array
Hi team, How do I replace invalid characters from a number of strings using an array to store the invalid characters? I know that I have to use the .each function for every string i have eg. $("h2#mytring").each function (){ var thisString = $(this).text(); .................... Now what???? } Thanks in advance Dimitris
Function return true or false
HI sorry for english , i have a function with an ajax call ,this is my function : function controlla_valore(){ var valore= form_clienti.valore.value; $.ajax({ type: "POST", url: "../../common/ricerca_valore.php", data: "valore=" + valore , dataType: "html", success: function(ret) { if(ret==1){ return true; console.log(ret); } else{ return false; console.log(ret); } },
Strange slider jquery animation behaviour
Hi, I'm building a slider. Almost everything is finished -- but there's one issue, when a slide animates across the screen it does so normally until the halfway point and then after that it travels the remaining half incredibly quickly. Also at this halfway point the animation completion callback runs. This is the fiddle of my code: https://jsfiddle.net/90j6mod3/ This is a fiddle of how the slider should animate: https://jsfiddle.net/87bh59p4/ I've tried alternate ways of calling the animate function,
$.validator.addMethod not recognized
Hi, I am developping a webApp in Groovy Grails Tools Suite and i am trying to use the jQuery validation plugin to validate a field in my HTML. the problem is that even if i added the library in my project, the validator.addMethod is not recognized. Here is the part that don't work in my .js code: $( document ).ready(function() { $.validator.addMethod("regex",function(value, element, regexp) { var re = new RegExp(regexp); return this.optional(element) || re.test(value); }, "Format
Ajax post doesn't work
Hi, i try to make an ajax type post. I want a form search and enter a food searching in bdd and return the results correspond about the food enter. <form action="" id="searchForm"> <input type="text" placeholder="Search..." name="s" id="food"> <input type="submit" value="Search"> </form> <!-- the result of the search will be rendered inside this div --> <div id="result"> </div> my script jquery : <script> $('#searchForm').submit(function(event) { // Stop la propagation par défaut
Cycle2 - Trigger CSS animations in active slide
Hi there, I am using malsup's Cycle2 plugin for a simple slider. Within each slide I have an animated svg which I want to run only when the slide is active. And th rerun when the slide becomes active once more. I thought I could use the class cycle-side-active as a trigger, but cannot get it to work. Any advice? Thanks A
Use Mobile Built-in Share Options
Hi, Using JQuery, is it possible to invoke the attached share box for an image to allow use to share the image by whatsapp, email, instagram ,etc...? Thanks, Jassim
Dynamic Nested Accordion based on JSON
HI, I'm having trouble creating a dynamic accordion based on json data. My Fiddle: https://jsfiddle.net/trvr7ynx/1/ Example Fiddle: http://jsfiddle.net/3zza6L4v/ of nested accordion. However, the example Fiddle doesn't have the same json structure as I do. I'm generating mine on server side from a data table, and it is "flat". What I need: For each unique Category(see my json in fiddle) >> accordion panel, inside it nested - all blocks belonging to that category, where "ItemTitle" is accordion
jQuery ajax() gets net::ERR_CONNECTION_TIMED_OUT on Chrome, not Firefox or Safari
I'm using Chrome 58.0.3029.68 beta (64-bit) on OSX 10.12.4, with jQuery 3.2.1. I want to use an ajax call to an IP address/DNS name to see if the host is (still) responding. I set up the ajax() call as below. Most of the time, a non-existent device/address returns the expected 'timeout' as the textStatus. (Note: Hosts that do respond will generally return 'error', because this looks like a CORS violation.) $.ajax({ url: "http://127.0.0.20", crossDomain: false, timeout: 6000, cache: false,
Selected Item in dropdown showing All instead of SelectedIndex Changed
I have one dropdown which is optional and need to show only up when there is data and is selected. When is selected, the next dropdown should only show data related to the selected item. For some reason I can see the selected ID but my Jquery function is not returning the matching item, rather returning everything because of the "data: { contractid: window.contractID }". I want to add extra parameter so that if that parameter is present, the related item should be only loaded. Below is my html
Upgrade jquery from 1.11.3 to 3.0
Hello, I am currently using jQuery version 1.11.3, I tried using jQuery latest version 3.0 with jQuery migrate plugin 3.0, but still my code is not working, where can I find the list of functions which are replaced in latest version. I appreciate if I can get help asap. Thanks
Pasting lines into numerous input boxes.
Im using pyperclip in python to send contents of txt file to my clipboard. theres five lines of text. I then go to my browser and I want to take those five lines and paste into 5 input boxes using JQuery. 1st line to 1st input box, 2nd line to 2nd...etc with a bind 'paste'. I looked at jakecigar 's code for doing this but it assumes inputs are stacked beside one another and it doesnt work on my input boxes. (Jakes code) Also I think these inputs are 'hidden', but I can target them in console. A
SlideIn Plugin - Feedback Welcome
I tried my hand at developing a plugin - a slide-in panel that works from all four sides. The panel overlays your main page and can be slid in on a mouse-click or mouse-hover. There are lots of other options for customization such as a grab handle, slide speed, opacity, peeking-in etc. The plugin is great for housing user options which are only for occasional use, especially overlaid on to whole screen UIs that demand the entire screen real estate. https://github.com/pete-rai/jquery-slidein Here
Changing iframe src with jquery with link not with button
Right now I have the following code which I can change the iframe src using a button <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input type="button" id="changeframe" value="Change"> <iframe id="declinedframe" class="embed-responsive-item" src="http://forgezilla.com" height="585" width="100%" ></iframe> // Go Last since changeframe hasn't exist yet. <script> $('#changeframe').click(function () { $('#declinedframe').attr('src', 'http://stackoverflow.com');
jquery validation not working properly on cloned elements
I have a dynamic form and I set name attribute for its elements on document ready and on cloning elements but I have problem with jquery validations when cloning elements, because after clonning elements, validations of cloned elements and next elements are not relevant and wrong: https://jsfiddle.net/4c93g5n1/
JSON parse unexpected character
I see plenty of people run into this but their situations seem different. What is the problem in my case? err: JSON.parse: unexpected character at line 1 column 2 of the JSON data If jsonlint.com says it is ok, why does jQuery feel otherwise? $(document).ready(function() {
try {
//alert('Here we go....');
window.jsondata = [{"label_no":"205","label_name":"20th Century Fox Records"}];
// https://jsonlint.com/ says Valid JSON
alert('window.jsondata length = ' + window.jsondata.length);
how can i use wildcard selector on my jquery code
I have jquery : <script> $('div:not(#post-body-xxxxxxxxx)').hide(); // hide everything except id="post-body-xxxxxxxxxx" $('#post-body-xxxxxxxxxx').appendTo('body'); // move id="post-body-xxxxxxxxx" up to the body </script> I want use wildcard selector on xxxxxxxxxx . How can it works with jquery..
hidemodal if a response variable is 1
HI at all , sorry for english. I have a modal to insert data in a db , the workflow is correct and data are saved in db . this is the jquery code : $(document).ready(function () { $("#insert_cliente").click(function(){ $('#ClientiModal').modal('show'); }); $("#button_insert_client").click(function(){ var name_modal = $("#id_class_nome_modal").val(); var surname_modal = $("#id_class_cognome_modal").val(); var telephone_modal
Text alignment in columns in jQuery UI accordion headings
I'd like to be able to align some text in the headings of a jQuery UI accordion so that values selected in each panel is summarized and visible... and lined up consistently on all the collapsed panel headings. Here is a sample of more or less what I'd like, but it was accomplished poorly and unreliably by using varying numbers of s. Additionally, I'd like to add a column on the right edge of the headings with an indication of whether the section is fully completed. Obviously, when the 4th section
Capturing a browser window close to give a "Save Entries?" dialog - in jQuery UI
I'm hoping to be able to catch a user who is closing the browser window to put up a jQuery UI modal dialog if it's detected that they've made some form changes without saving them. The page is an incremental interview process in an accordion, with the steps each saved using AJAX methods. But if they close without committing a save I'd like to be able to warn them. I've read a number of forums that give advice regarding this, but it seems to be a moving target. I've been trying: // Set up to detect
50/50 div min-height to match parent div
Hi, i have two div's which are both 50% of the browser window, the left div contains a paragraph of text and the other div contains an image with background-size:cover. when i resize the browser the div with the text in gets taller and taller the smaller the window gets. I have managed to match the height of the image div with the content div but how do i update the min-height value so it adjusts responsively? This is what i have so far. $(document).ready(function() { var divHeight = $('.AboutLeftBox').height();
Replace an object with another in an array using bootstrap modal
I'm trying to update an object if it's type="external" with the 'edit' button. On clicking edit, I get a pop-up/modal, wherein I can update the details. I need to fix 2 issues: * I can't see the old values in the update modal while trying to update the data in my actual application. * Also, on clicking update, it is refreshing the entire page content. I guess that's happening due to replaceWith() method. JSFiddle Note: I'd tried using splice earlier, but it causes duplication of updated objects.
Using contains() and not contains() in the same line.
Im trying to run contains() method twice. Also using next() method. I dont know the proper way to do that. I have elements I want to target but they only have b tags around them. Like 'Price:', beside that could be '$2'. If does NOT have '$2' then hide() those elements. (so only $2 prices are shown.) --Find b tags that are next to the b tag with "price"(which would hold the actual dollar amount) --WORKS $('b:contains("price")').next(); --Hides all of them - WORKS $('b:contains("price")').next().hide();
Why is if ($(this) == clickedObject) not working?
i wrote $(document).ready(function () { var clickedObject; $('.knob').mousedown(function () { clickedObject = $(this); }); $(".knob").mousemove(function (event) { if ($(this) == clickedObject) { console.log("test"); } } }); It doesn't work, it doesn't recognise the two objects as being the same. When I log both $(this) object and the clickedObject to the console, they look pretty much exactly the same to me. Am i missing something
Ajax - form select onchange and window load
I have a bit of code for an ecommerce website were developing at the moment when a user lands on the product details page they have the option to select a clothing size. Once the size is selected it shows the price and whether it is in stock. This is triggered by an onchange event on the select menu. When the page loads the first size auto selected but doesn't display the contents i.e price and stock level. is there anyway i can simply show this information when the pages loads? any help greatly
innerhtml/html text is not working in chrome
Hi, I am want to implement <br> in listbox item text but it's not working in chrome but working in firefox. need to know any alternate way to resolve this issue. HTML: <select id='lstBox1' style="width:240px;height:346px" multiple="multiple" > <option value="1" >ABCDEFGHIJKLMNOPQRSTUVWXYZ</option> </select> Jquery: $("#lstBox1 option[value='1']").innerHtml("ABCDEFGHIJKLMNOPQ<br/>RSTUVWXYZ"); Note: So that it will display in listbox like: ABCDEFGHIJKLMNOPQ RSTUVWXYZ
a.stopPropagation is not a function
In jQuery 2.2.3 , I got issue while using event.stopPropagation or return false. 1)When using event.stopPropagation i got error - a.stopPropagation is not a function 2)When using return false i got error - a.preventDefault is not a function
Update an object in the array using a modal form and display updated details
I'm trying to update an object with type="external" by clicking on the edit button. It brings up a pop-up, wherein I can enter the new information and it should then update the user accordingly. But somehow it doesn't seem to work. It just triggers a page refresh and nothing happens at all. Could you please help me fix this? JS Fiddle
jQuery Validate with jQuery Credit Card Validator
I am having some problems trying to use the jQuery validator plugin along side the jQuery credit card validator (http://jquerycreditcardvalidator.com). The problem I am having with my code is after my initial form submit that uses a credit card that is not accepted, going back to the form to correct the credit card, the form is being submitted after every key up event. What I am looking for is when a user inputs a credit card that is not of an accepted type, show an alert box to the user stating
Post and Retrieve the same time using ajx
Hi, I am using below code to post signup data using ajax but at the same time to get the registered data using json so it can be used by the browser. $.ajax({ type: "POST", url: 'https://www.mydomain.com/ws/signup.php', data: formData, processData: false, contentType: false, }).done(function () { viewModel.loadPanelVisible(false); customer.insert({ customer_id: data.Customer[0].customer_id, first_name: data.Customer[0].first_name, last_name: data.Customer[0].last_name,
Date picker range from any date
I am using date picker below is my code i need solution for i have two fieldes fromDate and tDate if i select every date in fromDate in toDate filed there will be only 7 days will be enabled, currently when i selected today date it is working but i need it for first condition. $("#fromdate").datepicker({ dateFormat: 'yy-mm-dd', minDate: new Date(2014, 1 - 1, 1),
Use “Esc” key to accomplish two tasks at once
On THIS page, I have a div with the class of “video-wrapper” witch, upon clicking the player’s toggle full screen button, is dynamically added a “full-screen” class. I aim to remove the “full-screen” class not only by using the toggle full screen button, but by pressing the “Esc” on the keyboard. foe this purpose I have written the code: $(document).on('keyup',function(evt) {
if (evt.keyCode == 27 && $('.video-wrapper').hasClass('full-screen')) {
console.log(evt.keyCode);
$('.video-wrapper').removeClass("full-screen");
query inserting dynamic html as string instead of html?
I have the following code which inserts a div at the top of a page: function setUpAnnouncementsContainer() { var announcements = 'Letterpress scenester franzen, shabby chic meh hella knausgaard 3 wolf moon craft beer ethical chillwave hot chicken beard. Tbh vexillologist tousled .'; var divAnnouncements = '<div id="divAnnouncements">' + announcements + '</div>'; var divAnnouncementsContainer = '<div id="divAnnouncementsContainer" class="col-xs-12 col-md-12 col-xl-12">' + divAnnouncements + '</div>';
Anomaly with combination of resizable/draggable
Hi All, Something wrong on a resize and draggable item with containment. The bug comes when the resize grow on left and the border touch the container /*! jQuery UI - v1.12.1 - 2017-04-21 I don't use responsive yet.
finding focused item in iframe
I'm trying to find the focused item within an iframe but failing! Whenever I insert into the iframe, the item appears to be focused. For example if I insert a table then the cursor is always in the last cell. As a I test I am trying to change the background color of the cell to see if it is working but this always changes the iframe body not the item inserted so not picking up the focused "thing" var d1 = $.Deferred(); $.when(d1).then(function () { var $iframe = $("#ifr").contents(); var focused
Next Page