[英]Form Text Area creates a URL
我在這里有一個非常簡單的需求。
我想要一個文本區域,其中填充了一行 ID - 每個 ID 將在一個新行上。
我怎樣才能從中生成一個 URL?
12345
09876
提交后應生成為https://xx.com/12345&09876
我一直在使用此表單值創建一個 URL並將其更改為文本區域,但無法將每個換行符更改為 url 字符串中的“&”。
任何幫助都會很棒!
<script type="text/javascript">
function goToPage() {
var page = document.getElementById('page').value;
window.location = "https://google.com/" + page;
}
</script>
<textarea name="textarea" style="width:250px;height:150px;" id="page"></textarea>
<input type="submit" value="submit" onclick="goToPage();" />
您可以通過\\n
拆分以獲取每行中的字符並通過&
加入,然后刪除最后一個字符:
var url = txt.value.split("\\n").join("&").slice(0, -1); console.log(url);
<textarea id="txt"> 12345 09876 </textarea>
在表格的情況下:
txt.addEventListener('input', function(){ form.action = txt.value.split("\\n").join("&").slice(0, -1); console.log(form.action); })
<textarea id="txt"> 12345 09876 </textarea> <form id="form"> <button>Submit</button> </form>
在您的特定情況下:
<textarea name="textarea" style="width:250px;height:150px;" id="page"></textarea> <input type="submit" value="submit" onclick="goToPage();" /> <script type="text/javascript"> function goToPage() { var page = document.getElementById("page").value.split("\\n").join("&"); alert(page); window.location = "https://google.com/" + page; } </script>
您可以使用 JavaScript 替換函數替換字符串中的文本,如下所示:
var newString = oldString.replace(/(\r\n|\r|\n)/g, '&');
這一行采用字符串變量 oldString(它應該包含所有換行符的數據)並將所有換行符更改為&符號。 它使用稱為正則表達式的東西來查找所有換行符。
所以對於你的 HTML:
<script type="text/javascript">
function goToPage() {
var page = document.getElementById('page').value;
window.location = "https://google.com/" + page.replace(/(\r\n|\r|\n)/g, '&');
}
</script>
<textarea name="textarea" style="width:250px;height:150px;" id="page"></textarea>
<input type="submit" value="submit" onclick="goToPage();" />
通過這樣做嘗試通過\\n
拆分文本區域:
var split_text = your_text_area.split("\n"); // Replace your_text_area
將在文本區域中傳遞的字符串將被\\n
(換行符) split_text
,並且每一行都將插入到split_text
變量中,該變量是一個數組。
然后,您可以從數組中生成一個 URL,如下所示:
var url = '';
for(let i = 0; i < split_text.length; i++)
{
url += split_text[i];
if((i+1) != split_text.length) // <-- Not the most optimized way to do it
{
url += "&";
}
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.