使用JavaScript设置href属性时会添加不需要的文本

我正在本地主机上开发：

http://127.0.0.1:8000

当我在网站上执行一些搜索时，我希望如果查询没有返回结果，

newentry

按钮允许从搜索输入中搜索的内容创建新文章

因此，如果我搜索“whatever”，但没有名为“whatever”的文章，则按钮应将我重定向到文章“whatever”的创建页面

<script>
$( document ).ready(function() {
    var newEntryUrl = window.location.hostname+":8000/wiki/_create/?slug="+"{{ search_query }}";
    document.getElementById('newEntrybtn').setAttribute('href',newEntryUrl); 
});
</script>

{% for article in articles %}
{% block wiki_search_loop2 %}
{% endblock %}
{% empty%}
    There is no page created for '{{ search_query }}', would you like to create a page nowee?
    <a class="btn btn-success" id="newEntrybtn" role="button"><i class="fa fa-plus" aria-hidden="true"></i> New entry ({{ search_query }})</a>
{% endfor %}

$（文档）.ready（函数（）{
var newEntryUrl=window.location.hostname+“：8000/wiki/\u create/？slug=“+”{{search\u query}}”；
document.getElementById（'newEntrybtn'）.setAttribute（'href'，newEntryUrl）；
});
{文章%中的文章为%s}
{%block wiki\u search\u loop2%}
{%endblock%}
{%empty%}
没有为“{{search\u query}}”创建页面，是否立即创建页面？
新条目（{search\u query}}）
{%endfor%}

为了计算创建新文章的url，我使用以下行：

var newEntryUrl=window.location.hostname+”：8000/wiki/\u create/？slug=“+”{{search\u query}”

如果我发出
警报（newEntryUrl）
它返回所需的结果：
127.0.0.1:8000/wiki/\u create/？slug=which

但是，如果我单击
newEntrybtn
按钮，它会将我重定向到以下url:
http://127.0.0.1:8000/wiki/_search/127.0.0.1:8000/wiki/_create/?slug=whatever

这对我来说很奇怪，因为我从来没有给按钮分配href属性，更不用说给它分配任何值了。在默认情况下，它似乎以某种方式获得了当前页面的值

我的问题是，如何删除当前页面：
http://127.0.0.1:8000/wiki/_search/
因此按钮href只有以下结构：
127.0.0.1:8000/wiki/\u create/？slug=无论什么
？
问题是因为您使用了相对URL作为href，导致浏览器将其附加到您正在查看的当前URL

在您的示例中，您的按钮设置如下：

<a class="btn btn-success" id="newEntrybtn" role="button" href="127.0.0.1/...">


问题是因为您使用相对URL作为href，导致浏览器将其附加到您正在查看的当前URL

在您的示例中，您的按钮设置如下：

<a class="btn btn-success" id="newEntrybtn" role="button" href="127.0.0.1/...">


我想您是在两次追加值。一次是在页面加载时，因为它位于document.ready函数中，另一次是在单击按钮时。尝试将其写入另一个函数，并在单击按钮时调用该函数

setAttribute被调用了两次


函数createUrl（）{
var newEntryUrl=window.location.hostname+“：8000/wiki/\u create/？slug=“+”{{search\u query}}”；
var newEntryBtn=document.getElementById（'newEntryBtn'）
newEntryBtn.addEventListener（“单击”函数（）{
setAttribute（'href'，newEntryUrl）；
})
我认为您添加了两次值。一次是在页面加载时添加的，因为它位于document.ready函数中，另一次是在单击按钮时添加的。请尝试在另一个函数中写入该值，并在单击按钮时调用该函数

setAttribute被调用了两次


函数createUrl（）{
var newEntryUrl=window.location.hostname+“：8000/wiki/\u create/？slug=“+”{{search\u query}}”；
var newEntryBtn=document.getElementById（'newEntryBtn'）
newEntryBtn.addEventListener（“单击”函数（）{
setAttribute（'href'，newEntryUrl）；
})
我在一行代码中找到了一个不使用JavaScript的好解决方案：

<a class="btn btn-success" href="/wiki/_create/?slug={{ search_query }}" role="button"><i class="fa fa-plus" aria-hidden="true"></i> New entry ({{ search_query }})</a>



感谢那些发布答案的人，你给了我很多启发。
我发现了一个不使用JavaScript的好解决方案，只需一行代码：

<a class="btn btn-success" href="/wiki/_create/?slug={{ search_query }}" role="button"><i class="fa fa-plus" aria-hidden="true"></i> New entry ({{ search_query }})</a>



感谢那些发布了答案的人，你给了我很多启发。
如果你尝试像var newEntryUrl=“/wiki/\u create/？slug=“+”{{search\u query}}”，理想情况下域将作为前缀，如果你尝试像var newEntryUrl=“/wiki/\u create/？slug=“+”这样的相对路径，请参考：或者理想情况下域将作为前缀{{search_query}}”；有关更多详细信息，请参阅：或
<a class="btn btn-success" href="/wiki/_create/?slug={{ search_query }}" role="button"><i class="fa fa-plus" aria-hidden="true"></i> New entry ({{ search_query }})</a>