Как вывести ссылку в поле ввода через подсказку?
Я борюсь с этим и не могу заставить его работать. Я использую jQuery, чтобы щелкнуть ссылку, которая откроет мне подсказку. В этом приглашении я хочу, чтобы пользователь добавил URL-адрес, чтобы связать его с некоторыми другими веб-сайтами. Это отлично работает, но я не могу правильно отобразить значение подсказки в поле ввода.
The error I am getting after adding my text in the prompt is the fact that it outputs it like [Object object].
Я знаю, как это сделать в простой JS, но не в jQuery, и мне нужно jQuery.
Это мой код:
$(".html-button").on("click", function () {
var urls = prompt("Add a link", "http://");
var setText = $("#post-text").val().append('<a href = "'+ urls + '"</a>');
// Adding prompt text into my input field
$("#post-text").val(setText);
});
Я подумал, что смогу сделать это, используя append вместо innerHTML, который я бы использовал в простом JS... Может кто-нибудь помочь?
PS: желательно, чтобы якорь не выводился уже в моем поле ввода, а только после отправки сообщения, но это приятно иметь.
Обновлено: Ссылка на скрипку
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вы, кажется, перепутали некоторые переменные здесь. Вы присваиваете значение ответа на приглашение переменной URL-адреса, но затем ожидаете, что оно будет в неопределенной переменной человек (предполагается, что вы использовали для этого пример из Учебника W3 Schools Tutorial (https://www.w3schools.com/jsref/met_win_prompt.asp)).
Предполагая, что ваш элемент ввода имеет идентификатор пост-текст, вы должны сделать следующее:
$("#post-text").val(urls);
Я работаю над предположением, что вы пишете URL-адрес в поле ввода, как вы предлагаете. Если вы хотите, чтобы эти теги также были в поле ввода, тогда это будет:
$("#post-text").val('<a href = "' + urls + '"</a>');
Если вы намерены вывести его как ссылку где-нибудь, включая теги HTML «a», чтобы по нему можно было щелкнуть, вам нужно будет добавить его к соответствующему элементу (не к полю ввода) в нужном месте в DOM/ на странице.
Наконец, если вы хотите записать значение в поле после отправки формы (по какой-либо причине), вы можете сохранить его в переменной и записать при отправке или, возможно, в скрытом поле. Я не уверен, почему вы хотели бы сделать это, хотя.
Надеюсь это поможет.
Я получаю ту же ошибку. Да, я использовал человека и перепутал его там, но ошибка остается той же. Вывод: [Object object] после добавления моего текста в подсказку...
Не могли бы вы создать JSFiddle, показывающий пример того, что вы сделали? jsfiddle.net
Конечно. Вот: jsfiddle.net/g0hnrx6a/1 и на ваш вопрос: я имел в виду описание ссылки. Таким образом, отображается только описание ссылки в поле ввода, но после отправки отображается сама ссылка. Но, как я уже сказал, это приятно иметь.
Я видел, что я сделал неправильно, но все равно получаю на выходе простой текст, хотя это якорь. Можем ли мы сделать что-то вроде описания ссылки?
Вы устанавливаете возвращаемое значение селектора jQuery для текста. Что я думаю, это то, что вы только что поняли? Итак, вы хотите, чтобы текстовое поле включало теги A и тому подобное?
var setText = $("#post-text").val('<a href = "' + URL + '">' + URL + '</a>');
Давайте продолжить обсуждение в чате.
Вот небольшой пример, дающий вам представление о том, что вы можете сделать, чтобы обеспечить желаемый пользовательский интерфейс — очевидно, вы замените запись данных в ссылку на экране записью в скрытое поле или что-то в этом роде. Убедитесь, что вы не вводите какие-либо XSS или другие уязвимости, должным образом очищая пользовательский ввод. jsfiddle.net/xkombteg
может ли это работать?
$("#post-text").val( $("#post-text").val() + '<a href = "'+ person + '"</a>');