Question

我有一个使用输入类型radio的标签表单，并希望使用addEventListener在点击时打开特定标签。

document.getElementById("job_location").addEventListener("click", function() {
  document.getElementById("tab1").checked = true;
});

 <a id="job_location" href="#map"><b><span class = "glyphicon glyphicon-map-marker"/>Location</b></a>

<input id="tab1" type="radio" name="tabs" />
<label for="tab1">My Location</label>

<task-section id="content1">
  <iframe style="width: 600;  height:450;" src="https://www.google.com/>
    </iframe>
</task-section>

我们的想法是，当有人点击ID为job_location的链接时，系统会点击标识为tab1的标签，并在content1中显示相关信息。

有人可以告诉我我的JavaScript有什么问题吗？

Answer 1

你错过了什么... www.google.com之后的双重报价

src="https://www.google.com/您已省略了结束"

要使代码正常工作，请尝试使用

HTML

<a id="job_location" href = "#map"><b><span class = "glyphicon glyphicon-map-marker"/>Location</b></a>

<div id="tabs">
<input id="tab1" type="radio" name="tabs"/>
  <label for="tab1">My Location</label>

</div>

<task-section id="content1">
    <iframe style= "width: 600;  height:450;" src="https://www.google.com/">
</iframe>
</task-section>

的JavaScript

document.getElementById("job_location").addEventListener("click", function(){
    document.getElementById("tabs").style.display = "block";
    document.getElementById("content1").style.display = "block";
    document.getElementById("tab1").checked = true;
    });

CSS

#tabs, #content1{
  display: none;
}

Check it out on JSfiddle

使用addEventListener打开输入类型无线电

1 个答案: