請問如何讓這個input的連結目標指向下方的iframe中
<style type="text/css">
.listMenu { list-style: none; padding: 0; color:red; display: flex; flex-wrap: nowrap; }
.listMenu>li { flex-grow:1; text-align:center; }
.listMenu>li input[type="radio"]{ /*display:none;*/ }
.listMenu>li input[type="radio"]:checked~label{ color:Black; cursor: default; }
.listMenu>li label{ cursor: pointer; }
.listMenu>li label:hover{ color:blue; }
</style>
<ul class="listMenu">
<li>
<input type="radio" name="tab" id="tab5" onclick="location.href='http://tw.yahoo.com'"/>
<label for="tab5">Yahoo</label>
</li>
</ul>
<iframe src="www.google.com" name="mainframe" width="100%" height="1500" scrolling="No" frameborder="0" id="mainframe"></iframe>
用了< base >還是覆蓋整頁
麻煩各位了~~~~謝謝
安奈…
<html>
<head>
<title>Iframe Link</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<!-- CSS -->
<style type="text/css">
.listMenu { list-style: none; padding: 0; color:red; display: flex; flex-wrap: nowrap; }
.listMenu>li { flex-grow:1; text-align:center; }
.listMenu>li input[type="radio"]{ /*display:none;*/ }
.listMenu>li input[type="radio"]:checked~label{ color:Black; cursor: default; }
.listMenu>li label{ cursor: pointer; }
.listMenu>li label:hover{ color:blue; }
</style>
<!-- Javascript -->
<script language="javascript">
$( document ).ready(function() {
$('#tab5').on( "click", function() {
$('#mainframe').attr('src','http://api.jquery.com/on/');
});
});
</script>
</head>
<body>
<ul class="listMenu">
<li>
<input type="radio" name="tab" id="tab5"/>
<label for="tab5">Yahoo</label>
</li>
</ul>
<iframe src="https://www.google.com" name="mainframe" width="100%" height="1500" scrolling="No" frameborder="0" id="mainframe"></iframe>
</body>
</html>
謝謝回答QQ
請問如果是想要把target下在
<input type="radio" name="tab" id="tab5" onclick="location.href='http://tw.yahoo.com'"/>
內的話呢
改了~
謝謝><
話說, 那個 label for還不大知道做什麼的,
感覺沒什麼差別...
有label for, 只要選擇label的文字,就可以選到radio的選項,簡單說就是為了方便使用者選擇
http://www.w3school.com.cn/tags/att_label_for.asp