选中时将复选框值转换为实时 url

Question

我正在创建一个表单，访问者通过单击相关复选框来选择他们希望查看的项目。 此时我将项目的网址作为复选框的值，并在单击请求按钮时出现。

1. 我想要看起来是实时的网址（a href 等），所以他们只需要点击链接，而不是复制并粘贴到浏览器地址中。
2. 如果可能的话，我希望复选框值成为项目，然后将其转换为 url onClick。这样一来，右键单击将不会显示将在单独的 java 文件中的 url。
3. 这并不紧急，但最终结果将被导入到站点的 csv/excel 文件中，而不是通过电子邮件发送结果。

任何帮助将不胜感激。

    function displayResult() {
    var se = document.getElementById("myEmailList"),
        send = document.getElementById("send"),
        x = document.getElementById("mySelect"),
        l = [],
        list = x.querySelectorAll(":checked");
        
    for (i = 0; i < list.length; i++) {
        l.push(list[i].value);
        

        var fn = document.getElementById('item_1').value;
        document.getElementById('links').value = 'https://example.com';

        var fn = document.getElementById('item_2').value;
        document.getElementById('links').value = 'https://bbc.co.uk';

        var fn = document.getElementById('item_3').value;
        document.getElementById('links').value = 'https://google.com';

        var fn = document.getElementById('item_4').value;
        document.getElementById('links').value = 'https://itv.com';
    }

    send.href = "mailto:" + l.join(", <br>");
    se.innerHTML = l.join(", <br>");
}

<form>
  Select items required:
  <fieldset id="mySelect">
    <input type="checkbox" id="item_1" name="item_1" value="item_1">
    Item 1 <br>
    <input type="checkbox" id="item_2" name="item_2" value="item_2">
    Item 2 <br>
    <input type="checkbox" id="item_3" name="item_3" value="item_3">
    Item 3 <br>
    <input type="checkbox" id="item_4" name="item_4" value="item_4">
    Item 4 <br>
  </fieldset>

<button type="button" onClick="displayResult()">Request</button>
<a id="send" href="mailto:">Send email</a>


<div id="myEmailList"> 
<br><br>

<textarea id="links" style="width:300px; "type="text" rows="4"></textarea>

Answer 1

那么，您希望表单将用户发送到相关位置吗？

<form>Select your place:
<fieldset id="mySelect">
    <input type="checkbox" value="https://www.bbc.co.uk"><a href="https://www.bbc.co.uk">Item 1</a>
    <br>
    <input type="checkbox" value="https://google.com"><a href="https://www.google.com">Item 2</a>
    <br>
    <input type="checkbox" value="email3@domain.com"><a href="mailto: email3@domain.com">Item 3</a>
    <br>
    <input type="checkbox" value="email4@domain.com"><a href="mailto: email4@domain.com">Item 4</a>
    <br>
</fieldset>
... 
</form>