отключить элемент в jQuery

Question

My demo есть здесь.

$(document).ready(function() { 
    $('.abc').click(function() { 
     $('#test').after('<textarea cols="125" rows="2" id="pReply" style="background-color:red;"></textarea>') 
    }); 
}); 

Когда я нажимаю на текст «ABC», он добавит текстовое поле. После добавления я хочу отключить текст «ABC». Это означает, что он не должен добавлять текстовые поля более одного.

Answer 1

Bind событие с помощью .one(). Когда событие запускается в первый раз, jQuery автоматически отвяжет его от элемента для вас.

$(document).ready(function() { 
    $('.abc').one('click', function() { 
     $('#test').after('<textarea cols="125" rows="2" id="pReply" style="background-color:red;"></textarea>') 
    }); 
}); 

Ссылка:.one()

DEMO

Answer 2

Просто удалите функцию щелчка с JQuery

Answer 3

Или вы можете использовать этот тип функции

<script> 
     var isClicked = false; 
     function appendIt(){ 
       if(!isClicked){ 
         //append text area 
       } 
       isClicked = true; 
     } 
</script> 

<h1 onclick="appendIt()"> chabadabada </h1> 

Answer 4

Вы можете использовать UNBIND функции, в которой вы бы отвязать нажмите после завершения вызова

JS код

$('.abc').click(function() 
    { 
     $('#test').after('<textarea cols="125" rows="2" id="pReply" style="background-color:red;"></textarea>'); 
     $(this).unbind('click');     
     } 

Working Fiddle

Подробнее о unbind функции

Answer 5

U можно связать с помощью one или с помощью $(this).off(event) после запуска события. так:

$(document).ready(function(){ 
    $('.abc').click(function(event){ 
     $('#test').after('<textarea cols="125" rows="2" id="pReply" style="background-color:red;"></textarea>'); 
     $(this).off(event); 
    }); 
}); 

или:

$(document).ready(function(){ 
    $('.abc').one('click',function(){ 
     $('#test').after('<textarea cols="125" rows="2" id="pReply" style="background-color:red;"></textarea>'); 
    }); 
}); 

Надеется, что это полезно!