附加文字以在点击时输入（JQuery）

Question

got a little problem on my hands.

I Am appending text to input on click. Works fine, but I want to append the text on button click, and on second and each click to append the same text without replicating/adding to the previous appended text.

So, basically on each click to clear the input of any text ( if any ) and append the same text on click.

I wrote the following JQuery :

$('.button').click(function(){
  $('#inputText').val($('#inputText').val() + 'Text to append');

  if($('#inputText').val() > 0) {
     $('#inputText').val('');
  } else {

}
});

I tried some other conditions but with no success. I don't know why.

Answer 1

I think that this is what you're looking for.

$('.button').on("click", function(){

  var text = "some text";
  var input = $('#inputText');
  var textLocation = $(input).val().indexOf(text);

  if(textLocation === -1){
    $(input).val( $(input).val() + text );
  }else{
    $(input).val( $(input).val().substr(0, textLocation) + text );
  }

});