Eltern-ID eines Spektrum-Farbwählers erhalten

Question

Ich habe 2 Farbwähler in 2 verschiedenen Div.

<div class="panel-heading" style="width:100%" id="h1"> 
<span style="float:right; padding-right:10px;" class="close"> <input type='text' class="basic" id="t1"/> </span> 
</div> 

<div class="panel-heading" style="width:100%" id="h2"> 
<span style="float:right; padding-right:10px;" class="close"> <input type='text' class="basic" id="t2"/> </span> 
</div> 

und das ist mein-Spektrum Picker JS:.

$(document).ready(function() { 
      $(".basic").spectrum({ 
       color: "rgb(244, 204, 204)", 
       showPaletteOnly: true, 
       hideAfterPaletteSelect: true, 
       change: function (color) 
       { 
        setBackgroundColor(color); 
       }, 
       palette: [ 
        ["rgba(168, 255, 102, 0.29)", "rgb(67, 67, 67)", "rgb(102, 102, 102)", 
        "rgb(204, 204, 204)", "rgb(217, 217, 217)", "rgb(255, 255, 255)"], 
        ["rgb(152, 0, 0)", "rgb(255, 0, 0)", "rgb(255, 153, 0)", "rgb(255, 255, 0)", "rgb(0, 255, 0)", 
        "rgb(0, 255, 255)", "rgb(74, 134, 232)", "rgb(0, 0, 255)", "rgb(153, 0, 255)", "rgb(255, 0, 255)"] 
        ] 
      }); 
}); 

nun innerhalb setBackgroundColor() Funktion, wie kann ich kennen zu lernen, welche Farbe Picker div i ausgewählt haben (ich versuche, das zu ändern Hintergrundfarbe von div) dh H1 oder H2.

Hinweis: Ich möchte keine Eingabe-ID in jquery als $("#t1").spectrum senden.

Bitte helfen Sie mir. Danke im Voraus.

Answer 1

Vielen Dank allen für Ihre Hilfe.

dies ist, wie seine Eltern bgcolor zu ändern:

change: function (color) 
{ 
    $(this).parent().parent().css('background',color); 
}, 

Answer 2

Sie können this verwenden, aber dies wird das Eingabeelement erfassen, da das Plugin an .basic Element angestellt wurde. Um die Eltern zu bekommen nur .parent() oder .closest() selbst verwenden:

$(".basic").spectrum({ 
    color: "rgb(244, 204, 204)", 
    showPaletteOnly: true, 
    hideAfterPaletteSelect: true, 
    change: function (color) { 
     // use this 
     console.log(this); // will show <input type='text' class="basic" id="t1"/> 
     // to access parent element use .closest 
     console.log($(this).closest('.panel-heading')); 
     // or 
     console.log($(this).closest('.close')); 
     setBackgroundColor(color); 
    },     
}); 

Answer 3

Vielleicht wird dies für Sie arbeiten.

$("#h1").focus(function() { 
    //code when div #h1 focused 
}); 

$("#h2").focus(function() { 
    //code when div #h2 focused 
}); 

oder

this 

mit Fokusfunktion als Norlihazmey Ghazali angegeben