javascript - 显示从 JAVA 到 HTML href 的可点击链接及其 URL 图像/文本等

Question

有一个简单的计算，如果选择的 2 单选为真，它将显示指向您可以找到它的 href 的正确链接。该链接在 HTML 中弹出，但如果您单击它，它会转到主页

enter code here

some of the HTML 
<div class="alignment">
 <label class="container">Stereo        
  <img class="portimg" src="img/av.svg" alt="astereoout">
   <input type="radio" name="Audio1" value="1" id="astereoout">
  <span class="checkmark"></span>
 </label>
</div>
<div class="alignment">
 <label class="container">Optical
   <img class="portimg" src="img/Optical.svg" alt="aOpticalin">
     <input type="radio" name="Audio2" value="9" id="aOpticalin">
   <span class="checkmark"></span>
  </label>
</div>
<button onclick="Selectport()" id="BtnData" 
class="Selectport">Select</button>

<a class="Results" id="DisplayResults" href=""></a>
</html>

javascript
function Selectport() {

var aOpticalin = document.getElementById("aOpticalin");
var aOpticalout = document.getElementById("aOpticalout");
var astereoout = document.getElementById("astereoout");
var astereoin = document.getElementById("astereoin");
var DisplayResults = document.getElementById("DisplayResults");

var OptoAv = ((astereoin.checked + aOpticalout.checked) && 
"https://en.wikipedia.org/wiki/Digital-to-analog_converter");
DisplayResults.innerHTML = OptoAv;
var AvToOp = ((astereoout.checked + aOpticalin.checked) && 
"https://en.wikipedia.org/wiki/S/PDIF");
DisplayResults.innerHTML += AvToOp;

标签： javascripthtml

Answer 1

问题是您实际上从未将 HREF 设置为 URL，您只是在其中显示innerHTML并且您附加了多个 URL。相反，您需要动态创建链接。

首先，我用 div 替换了你的锚。然后我添加了一个可重用的函数来创建链接。

新代码：

        <div id="DisplayResults"></div>

        function create_link(url, target_obj){
            var a = document.createElement('a');
            var linkText = document.createTextNode(url);
            a.appendChild(linkText);
            a.title = url;
            a.href = url;
            target_obj.appendChild(a);
        }

    function Selectport() {

    var aOpticalin = document.getElementById("aOpticalin");
    var aOpticalout = document.getElementById("aOpticalout");
    var astereoout = document.getElementById("astereoout");
    var astereoin = document.getElementById("astereoin");
    var DisplayResults = document.getElementById("DisplayResults");

        if(astereoin.checked && aOpticalout.checked){
           create_link("https://en.wikipedia.org/wiki/Digital-to-analog_converter",DisplayResults);
        }

        if(astereoout.checked && aOpticalin.checked){
            create_link("https://en.wikipedia.org/wiki/S/PDIF",DisplayResults);
        }
    }