javascript - Using JQuery to get text of a div that's a child of a header to replace a different header -


I am trying to get the child's text content of my event.target .div ('. Child #') child ('H6.class'), and replacing my other headers ('h1.replacHeader #') using this script below ... 

  $ ('h6.HeaderToBeClicked' ). Click (function (event) {var $ target = $ (this); $ ('. ReplaceHeader1'). Replace ("& lt; h1 class = 'replaceHeader1' & gt;" + $ target.children (". Child1 "). (" & Lt; h1 class = 'replaceHeader2' & gt; "+ $ target.children (".) 2 child 2 "). Text () +" & lt; / H1> ");}); }); HTML: & lt; Div id = "replacetheider" & gt; & Lt; H1 class = 'replaceHeader1' & gt; & Lt; / H1> & Lt; H1 class = 'replaceHeader2' & gt; & Lt; / H1> & Lt; / Div & gt; & Lt; Div id = "accordian" class = "acc" & gt; & Lt ;? Php $ counter = 1; ? & Gt; & Lt ;? Php foreach ($ tmpl-> $ var as vars) {? & Gt; & Lt; H6 class = "HeaderToBeClicked" & gt; & Lt; A href = "#" & gt; & Lt; Div class = "counter" & gt; & Lt ;? Php print $ counter "." ? & Gt; & Lt; / Div & gt; & Lt; Div class = "child1" & gt; & Lt ;? Php print $ var ['title'] ;? & Gt; & Lt; / Div & gt; & Lt; Div class = "child2" & gt; & Lt ;? Php print $ var ['name'] ;? & Gt; & Lt; / Div & gt; & Lt; / A & gt; & Lt; / H6 & gt; & Lt ;? Php $ counter = $ counter + 1; ? & Gt; & Lt ;? Php}? & Gt; & Lt; / Div & gt;

I have seen that .text () apparently does not apply to an event.target ... so how can I get it?

If $ target to h6.class If you intend to reference the element, then you should change this line: 

  var $ target = $ (event.target);

In: 

  var $ target = $ (this);

$ (event.target) The fact that any lineage element was clicked event then bubbles up to that element on which the handler ( h6 .class ) which is $ (this) .

Edit:

If it is similar to your HTML, the code runs completely. If (for example) .child1 and .child2 deep inside h6.class are nested, then we will need to make things a bit modifiable . 

  & lt; H6 square = 'square' & gt; & Lt; Div class = 'child1' & gt; This child is 1 & lt; / Div & gt; & Lt; Div class = 'child2' & gt; This child is 2 & lt; / Div & gt; & Lt; / H6 & gt; & Lt; Div class = "replaceHeader1" & gt; Header 1 & lt; / Div & gt; & Lt; Div class = "replaceHeader2" & gt; Header 2 & lt; / Div & gt; & Lt; Div class = "replaceHeader1" & gt; Header 1 & lt; / Div & gt; & Lt; Div class = "replaceHeader2" & gt; Header 2 & lt; / Div & gt;   Edit 2:  
 
 Try the code given below to the HTML you have posted. Please note that your  & lt; A href = "#" & gt; There is no closed tag for element  The code below should work in any way. 
 
  $ ('h6.HeaderToBeClicked'). Click (function (event) {var $ target = $ (this); $ ('. ReplaceHeader1') .text ($ target.find (". Child1"). Text ()); $ ('ReplaceHeader2') Text ($ target.find (".2 child2"). Text ());});  
 
 Believes that you can change the contents of your  .replaceHeader  elements. If you also need to change the tag name, you should replace  replacewith () .
to go back to use.

Comments

Post a Comment