CODEWITHSUNDEEP
javascriptjqueryhtmlcss
postgresnewbie
postgresnewbie

Reputation: 1468

Clear a property of element with jquery

i'm designing a basic form. I have an input text and a button. when i click button, if "input text" has no text inside, an "x" icon appears inside in "input text".

i'm putting that icon with jquery. but i dont know how to remove it. i want to clear this icon when user clicks inside input text. here's my jquery code. 

$('#lbl1').click(function () {
  if ($("#fill").val().length==0) {
        $("#fill").css({ background: "url(image/cikis.png) no-repeat right"});
  }
});

$('#fill').click(function () {
     //some codes here
});

here is my html lines:

 <label id="lbl1">Tıklama </label>
 <input type="text" id="fill" />

Upvotes: 0

Views: 87

Answers (3)

Code.Town
Code.Town

Reputation: 1226

Please see this working example:

http://jsbin.com/UgIl/1/edit?html,js,output

$(document).on("focus", "#fill", function (event) {
        $(this).filter(function () {
            return $(this).val() == ""
        }).css("background", "url(http://beoplay.com/resources/sbv-custom/img/linkbuttons/close-icon.png) right no-repeat transparent");
    });

    $(document).on("blur", "#fill", function (event) {
        $(this).filter(function () {
            return $(this).val() == "" 
        }).css("background-image", "none");
    });

Upvotes: 0

Anil kumar
Anil kumar

Reputation: 4177

you can achieve like this

$('#fill').click(function () {
     $(this).css( "background-image", "none");
});

Upvotes: 0

Jonathan Crowe
Jonathan Crowe

Reputation: 5803

$("#fill").click(function() {
     $(this).css("background-image", "none");
});

Upvotes: 1

Related Questions