I use one outer div and a div as a child element
<div id="parent"><div>lorem ipsum</div></div>
and I need to register a click on the parent div. If I use
$("#parent")click(function(){
// my code
});
the code starts also if I click on the child div. So how can I start my function only if there was a click on the parent div outsite the child div?
I have:
<p>Click here</p>
<div>cool content #1</div>
<p>Click here</p>
<div>cool content #2</div>
How if I click either <p> how do I select the <div> immediately following?
$(p + div).dosomething()
isn't working.
I'm trying to update a script I found out there in order to fit better my needs. The first step I want to update is the capability to bind a dynamic number of anchors.
Right now with the HTML below
<ul id="product_links">
<li class="first" ><a>FIRST></a></li>
<li class="second">SECOND</a></li>
<li class="third"><a>THIRD</a></li>
[Code].....
i have a menu generated by a list with nested lists. i want the parent link to stay highlighted when the mouse hovers over the sub menus. because those sub menus are also generated by jquery (qtip), CSS alone won't do it (triedul.topnav li:hover a {background-color: #F00;}).is there a way to do this using jquery?
View 15 Replies View RelatedDemonstration page: [url]
Adjust the CSS margins of the BODY element with the first slider. The yellow P (paragraph) element resizes to fit its smaller containing block, as I would expect.
Then, adjust the CSS border or padding of the BODY element with the second and third sliders. The P element does not resize, though its origin changes. Instead, it overflows its containing block.
Finally, adjust the margins again. The P element snaps back into its containing block.
As you can see from the source, this is jQuery 1.6.4 and jQueryUI 1.8 pulled from googleapis.com.
Edit: Client is Google Chrome16.0.889.0 dev-m.
When the page loads there will already be a drop-down on the page, here's an example of the drop down.
<select id="dropdown">
<option value="2121S">Option text</option>
<option value="2122S">Option text</option>
<option value="2123S">Option text</option>
<option value="2121A">Option text</option>
<option value="2122A">Option text</option>
<option value="2121K">Option text</option>
</select>
On page load it will evaluate this drop-down and repopulate it determined on their values. If there is an S in any of the values the drop-down will generate an option for 'S' like so.. <option value="s">S Option Text</option> And for the first code example in this post - the Javascript would be able to repopulate the drop-down with the following:
[Code]...
The bit of code in bold in the code below is giving me this error in IE: Error: Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; Trident/4.0; Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1) ; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.5.30729; Tablet PC 2.0; InfoPath.2; OfficeLiveConnector.1.4; .NET CLR 3.0.30729; OfficeLivePatch.1.3; MSN OptimizedIE8;ENGB)Timestamp: Tue, 16 Mar 2010 15:07:11 UTC Message: HTML Parsing Error: Unable to modify the parent container element before the child element is closed (KB927917)
[Code]....
I'm having some problems understanding the append() function. What I'd like to do is select an element using it's ID and add a row to the table with a HTML form element. The table is dynamically generated using a Django template ( form.as_table() ) so I'm not able to alter the original HTML markup too much.
If I had a table like this...
I'm trying to unselect element or not allow select element to prevent this:
How can i do this? This only happens on FF, on IE8 its fine..
My html:
I have a table with a couple of rows with two cells in each row and each cell has couple of info like office name, address and phone number etc. Using jquery for each, the address is being pulled out from each cell and fed into google map geocoder object to get the point and plot it in the map. Now at each hit of an Address value, I would also like to grab the unique value of phone and office name from the current cell from which jquery is getting address value..I need those values so i can display those values in the InfoWindow of the map? How do I get those values?
<table class="OfficeInfo" border="0" style="width: 100%" cellspacing="10px" cellpadding="15px">
<tr>
<td class="Office1" style="width=40%">
[code]....
I want to find the parent element of some element.
$("tr input").each(function (i) { //loop input elements within tr's
if(this.name == "cid[]"){
//checkbox
[code]....
I have the following
<div id="container">
<div class="row">blah</div>
<div class="row">blah</div>
<div class="row">blah</div>
<div class="row">blah</div>
<div class="row">blah</div>
</div>
I would like to move the upper most row which I'm referencing by the eq: $('.row').eq(0) to the end of div#container I thought I could use append or appendTo, but these don't seem to be working.
I have some html like the following
<div id="#tabcontainers">
<div>
<div class="content">xxx</div>
[code]....
I expected $('#tabcontainers div') to return just the four top level divs but instead it returns six. That is, it is returning the four top level divs within tabcontainers but also the child divs with class="content" inside the top level divs.Is there a way to just select the 4 top level divs (i.e. excluding the inner divs) other than putting class or id attributes on them and using those in the selector?
I try to get the parent element of a div based on the div content:
($('div:contains("' + BaseHtml + '")').parent().html();
where BaseHtml is the content of the div. but this always return null. How can I do?
but having fun with it. Would like tolearn how to do the following...2) Find the parent <li>.3) Grab the value of the attribute "jcarouselindex" and put it in avariable to be used elsewhere.Sample code below...
<ul id="carousel">
<li class="carousel-item" jcarouselindex="1">
<a href="/someurl"><img src="someimage.jpg" alt="" />
[code]....
Code JavaScript:
$('input[id^="system"]').change(function() {
var id = $(this).attr('id');
var parents = $('#' + id)
.parents()
.map(function () {
[Code]...
At the moment the the third parent of the input is a fieldset, which is fine, but I would like the script to explicitly get the fieldset element, rather than just land on it as the third parent.
I am trying to figure out the syntax for the following. For this version I am simply trying to select the 2nd child of the SLIDE HOLDER div. For this test I am just making the width grow. My next pass will be to get the index of the DOT clicked and then pass it to the child of the other parent. Please see line 24. I know this is incorrect but placed it to give you an idea of what I am trying to accomplish.
[Code]...
I need to select the last children of parent elements
For example
<ul>
<li></li> <-This will have the background #1a
<li></li> <-This will have the background #1a
<li><ul>
[Code]....
So I would need the last children. If there is no nested element then that is considered the last child. I have to write a jquery script to apply a background to the last children. A nested element can have a nested element and then that element's children will be considered the last ones so they will get the background but not the parents of those children. If the item has no children then that item will have a background.
So there are 3 different backgrounds. Each letter a, b c will represent a lighter tone compared to the previous color. C is lighter than B, B is lighter than A etc. So this will have to be a "smart" system in which the ul li will be updated and depending if it is the last one inhierarchyit will not have the arrow.
within a function for an onchange-handler ($(...).change(function(e) {...) i tried something like:
$(":parent input[name^=subsequentProperty]", this);
this does not work, but:
$("input[name^=subsequentProperty]", this.parentNode);
does work.
I have a list of divs that each look like this (simplified):
<div id="property1" class="property cms-repeat"> <h4>Property 1 - <span class="location cms-editable">location3</span></h4> <p><span class="download">Request a copy of the full property details <a href="#" title="Request property details" class="request"
[code]....
I got a UL LI menu and it's not working right. the problem is: when i want to open new branch the parent is closing. the code is in the attacment...
Attachments
index.txt
Size : 5.61 KB
Download : 357
Suppose I have something similar to this HTML (this is not my exact HTML, rewritten to simplify):
<a onclick="ShowHide(); return false;" href="#">show/hide</a>
<div>
<div id="summary">Summary of info below</div>
<div id="enclosure" style="display:none;">Information</div>
</div>
<a onclick="ShowHide(); return false;" href="#">show/hide</a>
<div>
[Code]...
These DIVS are full of information populated from a MSQL db. So the DIV names cannot be unique. I have this jQuery code:
[Code]....
This code actually works perfectly except for one major headache. When I click the 'hide/show' link on any of these - the only one that hides or shows is the first set. After research I feel like I'll need to use the .parent() selector or (this) somewhere but I feel like I've tried every combination.
how would select the first parent of the interacting 'this' ?
View 2 Replies View RelatedI have the list structure like this [code]...
My problem is
If I click on link which has ID ArtechGallery and which belongs to menu1 list
If I click a link which has ID HPGallery and which belongs to menu2 list
So, then, how to check whether the clicked element belongs to Menu1 or Menu2 ?
I have an <input type="checkbox"> whose immediate parent is an <a> tag. The <a> is significantly larger than the <input>.
I want the checkbox to toggle on/offwhether the <a> is clicked or the checkbox itself. I also wantto store the value of the checkbox after it changes.
This sounds simple butI'm having trouble with the event bubbling (as in, I don't understand it).
Here is my current code.
HTML:
My question is quite simple with an example:
[Code]...
