如何通过提示在输入字段中输出链接?

时间:2019-05-31 09:37:45

标签: javascript jquery html prompt

我正在为此而苦苦挣扎,无法使其正常工作。我正在使用jQuery单击将打开提示的链接。在此提示下,我希望用户添加一个URL以将其链接到其他网站。效果很好,但是我无法获得在输入​​字段中正确显示的提示值。

  

在提示中添加文本后出现的错误是事实   它像[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::最好不要在输入字段中已经输出锚点,而只是在提交帖子后才输出,但这真是太好了。

编辑:Fiddle link

1 个答案:

答案 0 :(得分:2)

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

假设您的输入元素的ID为后文字-那么您将执行以下操作:

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

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

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

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

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

希望这会有所帮助。