Jquery textbox change
Hi Guys. Is there any jquery event which is called when the readonly value of the text box is changed automatically I want to call an event (function) which should be called when the readonly value of the textbox is changed some how by other jquery events. Early Reply is highly appreciated. Best Regards, Sagar
Remove style from selected(highlighted) span/text in div
Hello, I have many divs with spans inside(just like it is below-no extra ids,classes for spans:/). [...] <div> <span style="color:red;">a</span> <span style="color:blue;">b</span> <span style="color:white;">c</span> </div> <div> <span style="color:red;">d</span> <span style="color:blue;">a</span> <span style="color:white;">a</span> </div> [...] What I would like to achieve: user selects with mouse "ab", click button(input type=button) which remove style from selected span/spans. Similar behavior
problem with function load()
Hi All, My problem is: I have the site where I use the load function to make the menu. The html page looks like: <body> <div id="all"> <div id="content"> <div id="bar1"><p>Lalalala.</p></div> </div> <ul id="menu"> <li class="active"><a href="#" class="bar1">About us</a></li> <li><a href="#" class="bar2">Gallery</a></li> <li><a href="#" class="bar3">Contact</a></li> </ul> </div>
Fading slideshow flicker / queue problem on mouseover (slideSwitch.js)
I've adapted code from the slideSwitch.js tutorial by Jon Raasch, which is basically a fading slideshow. The script promotes the 'active' slide to a higher z-index and animates the opacity for a fading effect. It's working fine with a pause added to stop the slideshow temporarily on mouseover. The issue I'm having is I'm trying to stop the script from queuing up when repeatedly mousing over/off the slideshow. When this happens it flickers and goes berserk. I've experimented with stop(true,true) in
simultaneous animating and fade in
Here is my current jQuery document: $(document).ready(function() { $('#name').fadeOut(0); $('#enter').fadeOut(0); $('#name').fadeIn(1500); $('#enter').delay(1500).fadeIn(2500).animate({"margin-left": "340"}, (2000)); }); the problem is that in this line: $('#enter').delay(1500).fadeIn(2500).animate({"margin-left": "340"}, (2000)); it fades in and then moves (one after the other). Is there a way to make it fade in and move simultaneously? Also when fading in, the png images flip out in
delay and load not working properly in conjunction?
Now, I'm relatively new to using jQuery, and I stumbled across this problem. On this web site I'm developing for a client, he wants to have a simple search form on his main page, then, when the link for 'advanced' search is clicked, that form should be replaced by a more advanced search form. My solution works, but there's one problem. The advanced form can be seen before the simple form has been completely hidden, despite there being a delay function call before it. Any reason why delay doesn't
Redistributing jQuery
Hi, I have written an application using jQuery which I intended to distribute under GPL. Can I include jQuery with distribution? jQuery JavaScript Library v1.4.2 is used without any change. Regards, Pawan www.ashwina.com
jquery 1.4 slower than 1.3x when using append or html with large strings? firefox unresponsive script error
Hi guys, I've been using jquery for some time, and was very excited about the improvements in jquery 1.4 I have found however, that in one particular instance, jquery 1.4 seems to be performing slower than 1.3x, to the point that it has forced me to downgrade the script. I use jquery heavily throughout my web application; in this particular case, when a very large block of html consisting of a bunch of <tr>s is .appended (or .htmled, tried both) to a table, jquery 1.4 in firefox will give the "unresponsive
Problem with the next() function, not sure how to get around it!
Hi Guys, I am having a problem with the next() function. I am trying to point to the next <a href> element here but the next() function isn't working since I have an <li> in the way! How can I get around this? Here is my code: <ul class="pagingthing"> <li> <a href="#" rel="1">1</a> </li> <li> <a href="#" rel="2">2</a> </li>
Dynamicly created elements have events firing multiple times
Hi, sorry if this has been posted before but my brain is on the verge of exploding. I have a group of elements in a div. the group has an add and a remove button. on clicking the add it duplicates the whole div and adds it to the parent div. this works fine. I save it then I go and reload the page the data comes back from the db and populates two copies of the div now, since I hit the add button. so now I hit the add button again to add a third item. but instead of one I get two. lets say I
.post a .post response
Hey everyone. I am pretty new to javascript and jquery and am looking for some help with the below code. My problem seems to be on line 8 (the second .post). My logs show that I am posting name as XMLHttpRespose. However, if I alert(name), the correct value is alerted. Could someone help me to 1, understand WHY this doesn't work and 2, get it working correctly? Thanks, function load_tabs() { $.post("skins/new/includes/updateGroups.php?action=select", function(data) { saved_tabs =
.class selector not working in IE6
Hello, I am unfortunately having some problems with JQuery of late. I am working on a project in which I need to have an AJAX application working in all major browsers, including IE6 and IE7. I have created a click event for a button of the class "update" and "delete" in which an ajax request will be sent to the server. Unfortunately in IE6 (and only IE6) the event will not fire. After much experimentation I realized that it was the class selector. Here are some code tests I have been doing to get
Browser caching textarea value?
Hi: I have a textarea element, and a link action to empty the textarea. $('.area').empty(); Normally it works fine. But after a ajax call to send the textarea value, the empty() stops working. I also tried text(), html(), none of them are working. The original text in the textarea still stays there. I have no way changing its value. My guess is firefox caches it or something. Any clue? Thanks a lot.
Override JQuery Curvy Corners
I am using jquery curvy corners it works great everywhere but in IE7. I want to "de-activate" it but putting -webkit-border-top-left-radius:0; -webkit-border-top-right-radius:0; -moz-border-radius:0 0 0 0; -khtml-border-radius:0 0 0 0; border-radius:0 0 0 0;in the IE-specific style-sheet doesn't seem to work. I've looked in the code after the page is generated and it has class="main drawn hasCorners" jQuery1280509440617="3" jQuery1280509440570="337">in the class on the generated
Click event on child element.
Hi. Please someone tell me if this is possible? please see the code below. at the moment, when you click img, click event triggered because parent element has click event. I want click event not to be triggered when you click img. How would I do that? $("#click1").click(function(){ alert('Clicked.'); }); <div id="click1"> <img src="1.png" id="ime1"> Ckick here </div>
JQUERY Incompatibility with old Versions ( 1.1.2 - 1.2.4 - 1.4.2)
Hi every one. I have a very big problem. I am a really beginer with js and i don't know how to fix it. First of all, i need to say that i made some research but nothing works. I have the script from attachment (i will adapt to my pages, but i put them like so to make it more easier. Ok this script make this: When i click a link, is opening an popup windows. This windows is open with her own graphic. The PROBLEM!!!!!!! This use jquery 1.1.2 (yes it is an old version) and i work on my pages with 1.4.2
How to apply events to items that I add to page?
For example, I am using ajax and a bunch of code to generate a list that is dynamically generated. This part is working perfectly, however I can't seem to remove any items from said list (since they didn't exist when document.ready fired). How would I go about having a function that could remove items from my list? (tried declaring something like hideItem(){ $(this).parent('li').hide(); } and calling it in the onclick event of the removal link, but it says the function doesn't exist... Ideas?)
Page jump when changing height
Hello, I'm having a page jump problem. On button click, I'm adding a class to a ul, which changes the layout of it's contents and makes the ul taller. This makes the page height taller, and as far as I can tell is what is causing the page jump when I click the button. It does not cause a page jump if I set a massive height on the ul. This is not practical though, because the content is dynamic and having a ton of whitespace on the bottom isn't very classy. The concept is very similar to what
Autocomplete Plugin - Passing in a Checkbox Value
I'm using the autocomplete plugin from this tutorial: http://viralpatel.net/blogs/2009/06/tutorial-create-autocomplete-feature-with-java-jsp-jquery.html Environment is Windows XP 5.1.2600, Firefox 3.6.8 and Chrome 5.0.375 Code Snippets: <input type="text" id="country" name="country"/> <input type="checkbox" name="mycheck" id="mycheck" /> <script> $("#mycheck").click(function() { alert($('input[name=mycheck]:checked').val()); }); $("#country").autocomplete(
Jquery Slideshow Pre-load Help needed - Please
I'm currently building my site with the Thesis theme and Wordpress and I have a header banner using the jquery slideshow using the "wipe" cycle effect. Every thing lines-up and cycles properly, but I'm having a problem when the page reloads. After soem research, it seems I'm having a stacking problem - when the page first loads, all eight images/slides are viewable, or should I say, stacked, whcih is what it looks like. It only stays like that for a second, but it looks god awful. From my research,
jQuery changes display:block to display:inline in slideToggle?
On my site is two slideToggle functions, however, one of them does not work. I want it to stay in the block, but only through the slideToggle animation does it stay in the block, then it reverts back to inline. <script> $(document).ready(function(){ $("#button").click(function () { $("ul").slideToggle("slow"); }); $("#button2").click(function () { $("ls").slideToggle("slow"); }); }); </script> </head> <body> <div id="container"> <div id="title">
Attribute Contains Selector [name*=value]
i use it in a CMS. In my content page, when I insert a floating element, I use it to set the margin around element according to left or right float in this way: $('#content img[style*="float:left"]).css({ 'clear' : 'left', 'margin': '0px 20px 10px 0px' }); in chrome, mozilla and not-IE browser the selector with (: and/or ;) works but in IE doesn't work. Is there a solution?
get ID attribute from dragging a sortable portlet
Hello, I want to pull the ID tag from a div that has been moved using sortable portlets. For example: Here are my divs in the body <div id="container"> <div id="left" class="list" style="width: 49%; float:left;"> <div class="portlet" id="arrayorder1"> <div class="portlet-header">header one</div> <div class="portlet-content" id="one">portlet content one</div> </div> <div class="portlet" id="arrayorder2"> <div class="portlet-header">header two</div> <div class="portlet-content"
Create html table dynamically
How do I create html table dynamically? Here is my code: html code: <div id="dynamicTable"> </div> jquery code: function createTable() { $("#dynamicTable").append("<table>"); $("#dynamicTable").append("<caption>My table</caption>"); $("#dynamicTable").append("<thead>"); $("#dynamicTable").append("<tr>"); $("#dynamicTable").append("<th>A</th>"); $("#dynamicTable").append("<th>B</th>"); $("#dynamicTable").append("<th>C</th>");
Delay Hide
Hi there, I am just curious how you do the delay hide on elements. I have a div that on mouseover I want it to show a hidden div and on mouseout I want to hide the div again, only I want to give the user some time to mouse back over the toggle div to stop the other one from hiding. This would be for in cases where users accidently mouse out of the now visible div. So I had something like this: <div style="border: 1px solid #0C0C0C; background-color: #F1F1F1; color: #0c0c0c; width: 200px" id="testToggle">
Cycle Focus to First Form Element from Last Element & Vice Versa
Hello everyone, I have created a form with malsup's Form Plugin wherein it submits on change of the inputs. I have set up my jQuery script to index drop down menus and visible inputs, and uses that index to determine whether keydown of tab should move focus to the next element or the first element, and likewise with shift+tab keydown. However, instead of moving focus to the first element from the last element on tab keydown like I would like it to, it moves focus to the second element. How can I
Problem upgrading from 1.2.6 to 1.4
Hi, I'm using 1.2.6, and I have a code essentially like this: <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script> function clk(o) { if (o.checked) $(o).parent().css("border", "3px solid black"); else $(o).parent().css("border-width", "0px"); } function chg(n) { $("#cbx"+n).click(); } </script> </head> <body> <span><input id="cbx1" type="checkbox" onclick="clk(this)"></span> <span><input id="cbx2" type="checkbox" onclick="clk(this)"></span>
Help: Can`t select my "form" from loaded content in IE !
I load some content in a div containing one form. Then I submit this form via jquery-post. This works fine in Firefox but not in IE. It seems like I can't even select the form in IE. $data = $("#formBox").serialize(); //Does not work $url = $("#formBox").attr("action"); //Does not work Any Ideas ? Thanks a lot :-)
Add Group of Form Elements Dynamically
I'm building a custom component in Joomla. All the Jquery up till now is working just fine. I'm not sure if I'm using the wrong keywords or what, but I'm not having much success finding a way to make the following happen: I have a form that asks for a bunch of information. First it's name, etc... Then it asks for vehicle information: The code for that is this: <table class="rsmformtable contentpaneopen"> <tr> <td colspan="2">
help with checkboxes
I have the following code..I'm trying to uncheck all check boxes except the ones that are already checked in the current pane. code I have so far is not working for me..it's not allowing any checking once I put this part // Uncheck all check boxes but in this pane...Prevent multiple product download $('.accordion :checkbox').not(pane).attr('checked',false); $('.accordion :checkbox').click(function () { var pane = $(this).closest('div'); // Uncheck all check boxes but in this pane...Prevent multiple
Auto Load on Timed Delay
I have a div that has 4 buttons and another div inside that the four buttons load pages into depending on which one is clicked. Picture an image gallery except for images its loading pages. All good, all works. What I want to do is trigger the buttons to activate every five few seconds and load the pages on their own without the button having to be clicked on. basically creating a rotating type banner ad system. Below is the code for one of the buttons. $("#load4").click(function() {
perform / execute so and so, when anchor element 'clicked'
Hello all, as you can tell by the following statements, i'm new to jQuery. I'm trying to do the following (in plain english) without too much success.. Any help would be gladly appreciated! -- 1) when document ready.. 2) find the element with id 'next'. 3) pull / take all 'li' elements, and perform so and so, all whilst excluding 'last' element. $(document).ready(function() { $('#next').click(function() { $('li').each(function() { //for each li .. $(this).filter(':last');
undefined is null or not an object in jQuery Core IE only
IE (8 & compatibility mode) reports an 'undefined' is null or not an object error on line 30, char 144 of jQ 1.4.2.min.js when the following code is included in my page under a document.ready statement: $(document).ready(function() { $('#splashimg').load(function(){$('#splashtext').delay(4000).each(toggletext())}); $('#splashimg').attr('src', 'i/august2010splash.jpg'); ... where #splashimg is: <img src="/i/s.gif" name="splashimg" width="850"
append a variable to all links on a page
I need to append a session variable to all of the links on a page. Instead of manually going into each link, can jquery do this? Can someone give me an example? Thank you.
$.ajax success/error confusion!
Hi all, I need a little help with an ajax call. This is what I have at the moment: function importPages(category) { var uri = getUrl(); $.ajax({ type: 'get', url: uri, dataType: 'html', async: false, error: function(){ importPagesLocal(category); }, success: function(data) {; addPage(category,data); $("#"+category+"-mobile").html("<br/>"+data); } }); } Now; this works fine when the url is available, the success function runs as expected. When the url is unavailable, the error function runs as it
Help with jquery code
Hi, I have this script, effectively that calculates the price, from a few variables, as you can see. I need to do some calculations within the script with the final price from this script, so need to have the final price as a variable. I have tried several things to achieve this, but have not been able to. $(function() { $("#slider").slider({ value:00, min: 0, max: 2500, step: 5, slide: function(event, ui) { $("#amount").val(ui.value); $("#price").val('£'+ui.value*$("#rate").attr("value")); } });
key nav function
demo website I want to a function like Gmail, if you type a word, the related information will popup, and you can use up and down key to navigate the content, the related information and key move is done, but whan I use up and down key, the page will scroll to, how to prevent that?
IE6-8 Bug by using following code
hi i use jquery to update my chat. therefore i use this code: function update() { $.get("/chat/chats/show", function(data) { $(".chatboxcontent").html(
data); window.setTimeout(update, 1700); }); } //$("#chatbox_"+chatboxtitle+" .chatboxcontent").scrollTop($(
"#chatbox_"+chatboxtitle+" .chatboxcontent")[0]. scrollHeight); $(document).ready(function(e){ update(); var clicked = $('<input type="button" value="Send"/>').click( function(){ var value = $('textarea').val();
HTMLCollections and chaining
Quick question on the internals of jQuery and how it works with HTMLCollection objects and chaining. If I write... $('div').bind('click', function(i){...}).bind('focus', function(.){...}).yada(function(){...});...the HTMLCollection of divs is walked through for each method right? As interacting with HTMLCollections is costly, would there be an appreciable speed gain to practise a pattern such as the following whenever working with HTMLCollections? var $divs = $('div'), i = 0, singleDiv; for (;singleDiv =
Set the toggle state dynamically
Hi all, I have a toggle button which show/hides a form. There is also an option that the form can be shown.hidden from a second button. When I click the second button in order to close the form I have to click twice the first button in order to open it. How can I set the toggle state of the first button in order to prevent this behavior? Thanks in advance
Next Page