$(document).on("click", "label.radeem-textbox", function () {
var content = $(".mytxt").text();
$(".radeem-textbox").replaceWith("<input class='radeem-textbox redeem-textbox'/>");
$(".radeem-textbox").val(content);
return false;
});
$(document).on("blur", "input.radeem-textbox", function () {
var content = $(this).val();
$(this).replaceWith("<label class='radeem-textbox'></label>");
$(".radeem-textbox").text(content);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<a href="javascript:void(0)" class="right-side-margin-top right-side-margin-bottom display-block add-to-wishlist">
<label class="add-to-wish radeem-textbox">Redeem a Coupon</label>
</a>I have jQuery code that allows labels to be converted into textboxes upon clicking. However, if nothing is entered in the textbox, both the textbox and label are not displayed. Is there a way to automatically focus on the textbox if nothing is entered?
<label class="add-to-wish radeem-textbox">Redeem a Coupon</label>
<script type="text/javascript">
$(document).on("click", "label.radeem-textbox", function () {
var content = $(".mytxt").text();
$(".radeem-textbox").replaceWith("<input class='radeem-textbox'/>");
$(".radeem-textbox").val(content);
return false;
});
$(document).on("blur", "input.radeem-textbox", function () {
var content = $(this).val();
$(this).replaceWith("<label class='radeem-textbox'></label>");
$(".radeem-textbox").text(content);
});