Javascript-форум - появление кнопки при написании текста в textarea и input

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - появление кнопки при написании текста в textarea и input (https://javascript.ru/forum/misc/51994-poyavlenie-knopki-pri-napisanii-teksta-v-textarea-i-input.html)

появление кнопки при написании текста в textarea и input

Добрый день ув. разработчики помогите реализовать такую вещь.

Нужно что б при написании текста в поле textarea появлялась кнопка.

Вот получилось сделать так но при нажатии на кнопку она исчезает...
А, нужно чтоб при написании кнопка появлялась и при отсутствии текста исчезала и не исчезала при нажатии на нее как я писал выше.

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>

<body>
<textarea id="pole" cols="30" rows="10"></textarea><br>

<button style="display: none">Ok</button>
 <script>
    $(document).ready(function(){
    $('#pole').on('keyup', function(){
        $('button').fadeIn();
    });
    $('#pole').blur(function(){
        $('button').fadeOut();
    });
});
  </script>
</body>

</html>

И еще как сделать чтоб кнопка появлялась при вставки ссылок в поле input.

Заранее огромное спасибо за помощь!

<!DOCTYPE HTML>
<html>
  <head><meta charset="windows-1251" /> </head>
  <body>
<textarea></textarea>
<button style="display: none">push</button>
 <script>
button=document.querySelector("button")
textarea=document.querySelector("textarea")
textarea.oninput=function(){
   if(this.value==="") return button.style.display="none"
   button.style.display="block"
}
 </script>
  </body>
</html>

Цитата:

Сообщение от zoOmer

И еще как сделать чтоб кнопка появлялась при вставки ссылок в поле input.

точно так же. Если ссылки надо проверять на валидность, то дай шаблон

krutoy, Спасибо))))
На счет второго нет не нужно проверять. Просто есть обычное текстовое поле в котором можно вводить обычный текст но нужно сделать так чтоб при вставке в него ссылки появлялась кнопка.

Нужно искать регулярным выражением или как еще?

Цитата:

Сообщение от krutoy (Сообщение 343401)

<!DOCTYPE HTML>
<html>
  <head><meta charset="windows-1251" /> </head>
  <body>
<textarea></textarea>
<button style="display: none">push</button>
 <script>
button=document.querySelector("button")
textarea=document.querySelector("textarea")
textarea.oninput=function(){
   if(this.value==="") return button.style.display="none"
   button.style.display="block"
}
 </script>
  </body>
</html>

А как повесить по Айди?

Цитата:

Сообщение от zoOmer

А как повесить по Айди?

<!DOCTYPE HTML>
<html>
  <head><meta charset="windows-1251" /> </head>
  <body>
<textarea id="textarea"></textarea>
<button style="display: none" id="button">push</button>
 <script>
button=document.querySelector("#button")
textarea=document.querySelector("#textarea")
textarea.oninput=function(){
   if(this.value==="") return button.style.display="none"
   button.style.display="block"
}
 </script>
  </body>
</html>

Цитата:

Сообщение от zoOmer (Сообщение 343441)

попробуй вот так

<!DOCTYPE HTML>
<html>
  <head><meta charset="windows-1251" /> </head>
  <body>
<input id="input" />
<button style="display: none" id="button">push</button>
 <script>
button=document.querySelector("#button")
input=document.querySelector("#input")
input.oninput=function(){
   if(/(\s+|^)http(s)?:\/\/[.\w-]+\.\w{2,3}(\s+|$)/.test(this.value)) return button.style.display="block"
   button.style.display="none"
}
 </script>
  </body>
</html>

Кнопка будет появляться в случае появлния ссылки в тексте. Проверка не идеальная, но для сельской местности пойдет. Если же надо, чтобы не было ничго кроме ссылки, надо по другому:

<!DOCTYPE HTML>
<html>
  <head><meta charset="windows-1251" /> </head>
  <body>
<input id="input" />
<button style="display: none" id="button">push</button>
 <script>
button=document.querySelector("#button")
input=document.querySelector("#input")
input.oninput=function(){
   if(/^http(s)?:\/\/[.\w-]+\.\w{2,3}$/.test(this.value)) return button.style.display="block"
   button.style.display="none"
}
 </script>
  </body>
</html>