JQuery फ़ंक्शन के साथ एंकर टैग एक से अधिक बार शुरू नहीं होता है - jquery, html, एंकर

मेरे पास एक एंकर टैग है

<a href="javascript:void(0);" class="edit"> <div class="text">original</div><div class="active-text hidden">hide</div></a>

एक प्रश्न समारोह जुड़े हुए हैं

//activate editing
$(".edit").on("click", function(e){
e.preventDefault();
$(this).find(".text").addClass("hidden");
$(this).find(".active-text").removeClass("hidden");
$(this).prev("span").attr("contenteditable", "true").addClass("active-editing");
});

//deactivate editing
$(".edit-tag.noli .active-text").on("click", function() {
$(this).parent().find(".text").removeClass("hidden");
$(this).parent().find(".active-text").addClass("hidden");
$(this).prev("span").attr("contenteditable", "false").removeClass("active-editing");
});

क्या कोई मुझे यह समझने में मदद कर सकता है कि मैं इस लिंक को एक से अधिक बार क्यों नहीं क्लिक कर सकता हूं?

उत्तर:

उत्तर № 1 के लिए 1

इस तरह प्रयोग करें,

    var flag = true;
$(".edit").on("click", function (e) {
e.preventDefault();
$(this).find(".text").addClass("hidden");
$(this).find(".active-text").toggleClass("hidden");
if (flag) {
$(this).prev("span").attr("contenteditable", "true").addClass("active-editing");
} else {
$(this).prev("span").attr("contenteditable", "false").removeClass("active-editing");
}
flag = false;
});

डेमो


उत्तर № 2 के लिए 1

आपको ऐसा कुछ चाहिए ???

<a href="javascript:void(0);" class="edit">show-hide</a>
<div class="text">original</div>
<div class="active-text" style="display:none;">hide</div>

$(".edit").on("click", function () {
//since void(0) no need for prevent default
$(".text").toggle();
$(".active-text").toggle();
$(this).prev("span").attr("contenteditable", "true").addClass("active-editing");
});

jsfiddle डेमो


संबंधित सवाल
सबसे लोकप्रिय