您可以看看我的代码,因为我不确定它为什么不起作用。JavaScript - 无输出
我目前的情况是,当你勾选单选按钮时,它会显示一个输出。例如“您选择了表A”。
不幸的是,当我点击单选按钮时,它什么也没做。
我想也许我的JavaScript函数的位移。但我没有看到任何错误。
<!DOC HTML>
<html>
<TITLE></TITLE>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-
1.4.2.min.css">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src ="jquery-1.11.0.min.js"></script>
<script src="jquery.cycle.all.js"></script>
<script type="text/javascript">
$('input[type="radio"]').click(function() {
$('.frame-wrapper').eq($(this).index() -1).fadeIn();
});
</script>
<style type="text/css">
.frame-wrapper {
display: none;
float: left;
width: 32%;
margin-top: 20px;
margin-right: 1%;
background-color: #eee;
}
</style>
</head>
<body>
<b>Please select an option</b>
A <input type="radio" name="Option" />
B <input type="radio" name="Option" />
C <input type="radio" name="Option" />
<div style="clear: both;"></div>
<div id="tblA" class="frame-wrapper">
You selected A, table tblA is shown
<frame src="http://www.huawei.com" />
</div>
<div id="tblB" class="frame-wrapper">
You selected B, table tblB is shown
<frame src="https://www.google.com/" />
</div>
<div id="tblC" class="frame-wrapper">
You selected C, table tblC is shown
</div>
</body>
</html>
我已经发现很奇怪的是你正在加载三个不同的jQuery版本。您正试图在存在之前找到'input'元素。请阅读jQuery教程以首先了解基础知识:http://learn.jquery.com/about-jquery/how-jquery-works/,http://learn.jquery.com/jquery-mobile/getting-started/ –