jQuery prev nächste Elemente

Question

Mein Problem in jQuery-Code. Ich habe diesen Code jsFiddle.

$(document).ready(function(){ 
    $("#clickinput1").click(function (evt) { 
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus(); 
    }); 
}); 

Bevor Sie auf die Schaltfläche klicken, ist die Eingabe deaktiviert und hat einen dunklen Hintergrund. Ich brauche, wenn Klick auf Button-Eingabe aktiviert sein soll (diese Arbeit) und Hintergrund ändern auf weiße Farbe oder keine. Ich kann das nicht machen. Bitte helfen)

Answer 1

die einfach .css("background-color","white") mit getan werden könnte, wie:

$(this).hide().prev("input[disabled]").prop("disabled", false).css("background-color","white").focus(); 

Hoffnung, das hilft.

$(document).ready(function() { 
 
    $("#clickinput1").click(function(evt) { 
 
    $(this).hide().prev("input[disabled]").prop("disabled", false).css("background-color", "white").focus(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<input type="text" name="customername" class="input" value="" disabled /> 
 

 
<div style="float:right;cursor:pointer;margin:2px 0 0 0px;" id="clickinput1"> 
 
    <img src="https://cdn4.iconfinder.com/data/icons/simplicio/128x128/document_edit.png" />button 
 
</div>

Answer 2

$(document).ready(function(){ 
    $("#clickinput1").click(function (evt) { 
     $(this).hide().prev("input[disabled]").prop("disabled", false).focus(); 
     $(".input").css("background-color", "white"); 
    }); 
}); 

Answer 3

Du CSS als $("#white").css("background-color:#fff"); geben. Das ist nicht der richtige Weg, CSS in jQuery zu definieren. Es sollte $("#white").css("background-color","#fff"); sein. Eine andere Sache ist, dass Sie keine ID als white zu irgendeinem des Elements gegeben haben. Wenn Sie all dies ändern, wird Ihr Problem gelöst.

$(document).ready(function() { 
 
    $("#clickinput1").click(function(evt) { 
 
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus(); 
 
    $("#white").css("background-color", "#fff"); 
 
    }); 
 
});

.input { 
 
    border: 0px; 
 
    outline: none; 
 
    background: #ccc; 
 
    height: 20px; 
 
    width: 250px; 
 
    font: 18px Calibri; 
 
    margin-top: 1px; 
 
} 
 

 
body { 
 
    background-color: #006699; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" name="customername" class="input" value="" id="white" disabled /> 
 
<div style="float:right;cursor:pointer;margin:2px 0 0 0px;" id="clickinput1"><img src="img/edit.png" />button</div>

Auch nicht definieren müssen wir jede id. Dies kann einfach wie diese

$(document).ready(function() { 
 
    $("#clickinput1").click(function(evt) { 
 
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus().css("background-color", "#fff"); 
 
    
 
    }); 
 
});

.input { 
 
    border: 0px; 
 
    outline: none; 
 
    background: #ccc; 
 
    height: 20px; 
 
    width: 250px; 
 
    font: 18px Calibri; 
 
    margin-top: 1px; 
 
} 
 

 
body { 
 
    background-color: #006699; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" name="customername" class="input" value="" id="white" disabled /> 
 
<div style="float:right;cursor:pointer;margin:2px 0 0 0px;" id="clickinput1"><img src="img/edit.png" />button</div>