【问题标题】:How to output a link in an input field via a prompt?如何通过提示在输入字段中输出链接?
【发布时间】:2019-05-31 09:37:45
【问题描述】:

我正在为此苦苦挣扎,无法让它发挥作用。我正在使用 jQuery 单击一个链接,该链接将为我打开一个提示。在此提示中,我希望用户添加一个 URL 以将其链接到其他一些网站。这很好用,但我无法在输入字段中正确显示提示的值。

在提示中添加文本后出现的错误是事实 它像 [Object object] 一样输出它。

我确实知道如何在 plain 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:最好我不想输出已经在我的输入字段中的锚点,但只能在提交帖子之后输出,但这是一个很好的选择。

编辑:Fiddle link

【问题讨论】:

  • 这行得通吗? $("#post-text").val( $("#post-text").val() + '&lt;a href="'+ person + '"&lt;/a&gt;');

标签: javascript jquery html prompt


【解决方案1】:

您似乎在这里混淆了一些变量。您正在将提示响应的值分配给 var urls,但随后期望它位于未定义的 var person 中(猜想您已经使用了W3 学校教程 (https://www.w3schools.com/jsref/met_win_prompt.asp))。

假设您的输入元素的 id 为 post-text - 那么您可以这样做:

$("#post-text").val(urls);

我在这里假设您正在按照您的建议将 URL 写入输入字段。如果您也希望在输入字段中使用这些 a 标签,那么它将是:

 $("#post-text").val('<a href="' + urls + '"</a>');

如果您的意图是将其作为链接输出,包括 HTML 'a' 标记,以便可以单击它,那么您需要将其附加到正确位置的适当元素(不是输入字段) DOM/在页面上。

最后,如果您想在表单提交后将值写入字段(无论出于何种原因),您可以将其存储在变量中并在提交时写入,或者可能在隐藏字段中。不过,我不确定您为什么要这样做。

希望这会有所帮助。

【讨论】:

  • 我遇到了同样的错误。是的,我使用了 person 并将其混合在一起,但错误仍然相同。输出为:[Object object] 在提示符中添加我的文本后...
  • 你能创建一个 JSFiddle 来展示你所做的事情吗? jsfiddle.net
  • 当然。给你:jsfiddle.net/g0hnrx6a/1 和你的问题:我的意思是链接描述。所以只在输入字段中显示链接描述,但在提交后,显示链接本身。但正如我所说,拥有它真是太好了。
  • var setText = $("#post-text").val('' + urls + '');跨度>
  • 这里有一个小例子,让您了解可以做些什么来提供您正在寻找的用户体验 - 显然,您可以用书写代替将数据写入屏幕上的链接到一个隐藏的领域或类似的东西。通过正确清理用户输入,确保不会引入任何 XSS 或其他漏洞。 jsfiddle.net/xkombteg
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2023-04-03
  • 1970-01-01
  • 2016-04-16
  • 2011-09-10
  • 2021-10-22
  • 2022-11-18
  • 2015-02-21
相关资源
最近更新 更多