Traversieren Klassen mit Jquery

Question

Ich bin brandneu bei der Arbeit mit Jquery, das ist eigentlich mein erstes echtes Projekt damit, und ich habe ein bisschen Ärger. Hier ist mein HTML: Edit: Alles klar, ich habe den Code ausgearbeitet und auch wo die Funktion aufgerufen wird.

<tr><th scope="row"><?php echo $box_name[$i] ?></th> 
      <td> 

      <div class="parent_div"> 
       <div><strong>Select an image</strong></div> 
       <p><?php $this->_addDropDown($box[$i].'_option', array('default' => 'Default', 'custom_image' => 'Custom Image')); ?></p> 


       <div class="upload_container"> 
        <div>Upload a new image: <a href="" id="upload_button" class="thickbox upload_file">Upload File</a></div> 
        <?php $this->_addHidden($box[$i]); ?> 
        <?php $this->_addDefaultHidden('default_'.$box[$i]); ?> 


        <?php $box_url = (! empty($wp_theme_options[$box[$i]])) ? $wp_theme_options[$box[$i]] : $wp_theme_options['default_'.$box[$i]]; ?> 
        <?php if (! empty($box_url)) : ?> 
         <?php $box_path = iThemesFileUtility::get_file_from_url($box_url); ?> 
         <?php if (! is_wp_error($box_path)) : ?> 
          <?php $box_thumb = iThemesFileUtility::resize_image($box_path, $this->_options['box_preview_width'], $this->_options['box_preview_height'], true); ?> 
          <?php if (! is_wp_error($box_thumb)) : ?> 
           <a href="<?php echo $box_url; ?>" target="_blank"><img id="image_thumbnail" src="<?php echo $box_thumb['url']; ?>" /></a> 
       <?php endif; ?>   
       </div> 
      </div> 

      </td> 

    </tr> 


<?php endfor; ?> 

Was ich zur Zeit zu tun versuche, ist so etwas wie.

function refreshImageBoxOptions(id) { 
if($("#this_item" + id).attr("value") == 'default') { 
    $(this).parents(".parent_div").find(".child_div").slideUp(); 
} 
else if($("#this_item" + id).attr("value") == 'something_else') { 
    $(this).parents(".parent_div").find(".child_div").slideDown(); 
} 
} 

Wenn ich aus einem Teil des Codes geschnitten, ich das $ bekommen kann ("parent_div.") SlideUp(). und das $ (". child_div"). slideUp(); um gut zu funktionieren. Es ist nur, wenn ich versuche, $ (this) .parents (". Parent_div") zu verwenden. Find (". Child_div"). SlideUp(); dass ich ein Problem habe.

Ich bin durch diese Seite und viele andere gegangen, und ich denke, ich brauche nur frische Augen, um zu sehen, ob ich hier etwas falsch mache.

Hier wird die Funktion aufgerufen.

$(document).ready(
    function(){ 

     $(".child_div").hide(); 

      $("#left_option").change(
      function(e) { 
       refreshImageBoxOptions("box_left"); 
       ; 

      } 
     ); 
     $("#middle_option").change(
      function(e) { 
       refreshImageBoxOptions("box_middle"); 

      } 
     ); 
     $("#right_option").change(
      function(e) { 
       refreshImageBoxOptions("box_right"); 

      } 
     ); 

} 
); 
}) (jQuery); 

Answer 1

Vielleicht ändern:

$(this).parents(".parent_div").find(".child_div") 

dazu:

$(this).parents(".parent_div").children(".child_div") 

hier Erraten, da ich von der Entstehung der this bin nicht sicher - viel Glück.

Answer 2

Es klingt, als ob Sie einen falschen Kontext haben. Das "Dies" innerhalb der Funktion bezieht sich auf das Element, das das Ereignis ausgelöst hat, aber wir können nicht sagen, was das ist.

Können Sie mich den Kontext der Aufrufe an diese Funktion wissen lassen. Wie ist der "dies" Kontext? Wenn Sie die js einfügen könnten, die diese Funktionen tatsächlich aufruft, würde es helfen.

Sind Sie sicher, dass das "Dies" zu dieser Zeit ein Kind des div.parent_div ist?

Answer 3

in Ordnung, also habe ich es herausgefunden. Als meine Funktion angerufen wurde, gab ich das nicht an die Funktion weiter, also hatte sie keine Ahnung, was "das" war.

$("#option").change(
    function(e) { 
    refreshImageBoxOptions(this,"box_left"); 
    } 
); 



function refreshImageBoxOptions(current,id) { 
if($("#" + id + "_option").attr("value") == 'default') { 
    $(current).parents(".parent").find(".child").slideUp(); 
else if($("#" + id + "_option").attr("value") == 'custom_image') { 
    $(current).parents(".parent").find(".child").slideDown(); 
} 
} 

Vielen Dank für die tollen Ideen!