Как вытащить текст из нестандартного поля ввода и вставить его в другую строку на странице?

Question

[Rostyk Ice]

Здравствуйте, столкнулся с проблемой. Суть полягяет в том что бы вытащить текст из поля ввода и вставить его в другое поле ввода. Пробывал такой скрипт (для Tampermonkey):

$('body').append('<input type="button" value="Н" id="btn">') 
  $("#btn").css("position", "absolute").css("top", 300).css("left", 5).css({ color: "red" });
  $('#btn').click(function(){
      $('[name="image"]').val($('[id="cke_197_textInput"]').val());
   });

Но он ничего не делает так как в поле у кторого есть только ID нету текста который мне нужен, а текст есть в :

<textarea name="category_description[3][description]" id="description3" style="visibility: hidden; display: none;">
"<p>
	<img alt="" src="http://plytka.net/image/data/www.agromat.ua/Aleksandryya/142970b.jpg" style="font-size: 12px; width: 528px; height: 300px;" /></p>
<p>

Текст который нужно вытащить

http://plytka.net/image/data/www.agromat.ua/Aleksandryya/142970b.jpg

.
А сам текст выделен желтым на приведенной ниже картинке

Ну и как взять текст и вставить его в строку ввода на странице с name="image" при нажатии на кнопку я незнаю так как мало знаю о JS, подскажите в чем проблема?

Answer 1

[Сергей Новиков]

$("textarea[name='category_description[3][description]']").find("img").attr("src");

EDIT:

$('#btn').click(function(){
    $('[name="image"]').val(/<img\s+src\s*=\s*(["'][^"']+["']|[^>]+)>/.exec($("textarea").val())[1].slice(1, -1));
});

Comments

[Rostyk Ice]

Так как я не силен в скриптах можно вас попросить продолжить ваш ответ после
$('#btn').click(function(){
А то незнаю как интегрировать ваш ответ в мой код.

[Сергей Новиков]

Я вас не правильно понял, поправил в ответ.

[Rostyk Ice]

Сергей Новиков: Незннаю в чем проблема но оно не вставляет текст в строку. Возможно потому что textarea много на странице ?

[Сергей Новиков]

Не думаю что textarea с name='category_description[3][description]' много. Проверьте что выдает $("textarea[name='category_description[3][description]']") в консоли. Укажите более конкретный селектор для $('[name="image"]'). И, в зависимости от элемента, используйте api.jquery.com/val , api.jquery.com/text или https://api.jquery.com/html/ .

[Rostyk Ice]

Сергей Новиков: В консоли нечего не выдает. Конкретный селектор

<input type="text" name="image" value="" id="image">

[Сергей Новиков]

Вот полный код:

$('#btn').click(function(){
    var src = /<img\s+src\s*=\s*(["'][^"']+["']|[^>]+)>/.exec($("textarea[name='category_description[3][description']").val());

    if (src.length > 1) {
        $('#image').val(src[1].slice(1, -1));
    }
});

[Rostyk Ice]

Сергей Новиков: В консоле ерор : Uncaught TypeError: Cannot read property 'length' of null
Может дать больше исходного кода ?

[Сергей Новиков]

... if(src && src.length > 1) ...

[Rostyk Ice]

Сергей Новиков: Нужно взять текст из строки ввода URL как на картинке ниже
, но если указать ID строки то ничего не происходит, может картинка поможет чем то ?

[Rostyk Ice]

Сергей Новиков: В чем может быть проблема?

[Сергей Новиков]

Проверяйте селекторы https://api.jquery.com/class-selector/ и https://api.jquery.com/id-selector/ .
$('#cke_197_textInput').val(src[1].slice(1, -1));

[Rostyk Ice]

Сергей Новиков: Нужно взять с id="cke_197_textInput" и в ставить в id="image"

[Сергей Новиков]

$('#btn').click(function(){
    $('#image').val($('#cke_197_textInput').val());
});

[Rostyk Ice]

Сергей Новиков: А можно к примеру если нажать на картинку оно получает ее url и уже вставляет url в строку id="image" ?

[Rostyk Ice]

Сергей Новиков: Думаю так будет легче если при зажатом ALT нажать на картинку то оно будет посыласть ее Url в строку ввода

[Сергей Новиков]

$('селектор_изображения').click(function (event) {
    if (event.altKey) {
        $('#image').val($(this).attr('src'));
    }
});

[Rostyk Ice]

Сергей Новиков: И что оно делает? какой селектор? куда оно вставляет?