显示从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;

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);
        }
    }

Answer 2

//*This is one banner link from Amazon(no spaces), Is it possible to display it in your 
//*code that you did in above
if(astereoin.checked && aOpticalout.checked){
create_link(<iframe style="width:120px;height:240px;" marginwidth="0" 
marginheight="0" scrolling="no" frameborder="0" src="//ws- 
na.amazon-adsystem.com/widgets/q? 
ServiceVersion=20070822&OneJS=1&Operation=GetAdHtml&MarketPlace=US&source=ac&ref= 
tf_til& ad_type=product_link&tracking_id=whatsmycable- 
20&marketplace=amazon&region=US&placement=B01HGHNCMW&asins=B01HGHNCMW&linkId= 
f3759832fc138a941ade9bde6128b083&show_border=true&link_opens_in_new_window= 
false&price_color=333333&title_color=000000&bg_color=d1d1d1">
</iframe>,DisplayResults);