用于更改 href 的 JQuery 脚本不起作用
Posted
技术标签:
【中文标题】用于更改 href 的 JQuery 脚本不起作用【英文标题】：JQuery Script to change href not working 【发布时间】：2015-11-09 11:37:05 【问题描述】：我想使用单选选项更改 CSS 文件，但我无法使脚本正常工作。我插入了一些代码来测试它，但它也不起作用。我正在使用 Bootstrap 框架，它工作正常，CSS 文件也工作。
我的 html 文件：
<!DOCTYPE html>
<html>
<head>
<link id="estilos" rel="stylesheet" type="text/css" href="./BootstrapColorSchemes/hefestus.css" >
<title>Spider Magic</title>
</head>
<body>
<div class="container">
<form class="form-horizontal" id="myForm">
<div class="radio-inline">
<label><input type="radio" name="optradio"
value="./BootstrapColorSchemes/adventuetime1.css">AT1</label>
</div>
<div class="radio-inline">
<label><input type="radio" name="optradio"
value="./BootstrapColorSchemes/adventuretime2.css">AT2</label>
</div>
<div class="radio-inline">
<label><input type="radio" name="optradio"
value="./BootstrapColorSchemes/adventuretime3.css">AT3</label>
</div>
</form>
</div>
<div>This border should be red</div>
<script src="./js/jquery-2.1.4.min.js"/>
<script>
$(document).ready(function()
console.log('i am ready');
$("div").css("border", "3px solid red");
$('#myForm input').on('change',function()
var selected=$('input[name="optradio"]:checked','#myForm').val();
$('#estilos').attr('href',selected);
alert(selected)
);
);</script>
<script src="./js/bootstrap.min.js"/>
</body>
</html>
【问题讨论】：
【参考方案1】：脚本标签不能用solidus自闭合需要一个闭合标签：
<script src="./js/bootstrap.min.js"></script>
并且要更改 css 这应该可以工作：
$('.radio-inline').click(function()
$('#estilos').attr('href', $(this).val());
);
【讨论】：
你没有检查它是否被“检查” 我会将事件处理程序编写为：$('#myForm').on('change', 'input[type=radio][name="optradio"]',function () 以利用无线电类型和表单范围，但真正的问题是您注意到脚本标记关闭。以上是关于用于更改 href 的 JQuery 脚本不起作用的主要内容，如果未能解决你的问题，请参考以下文章
为啥我的带有“$(this).next”的 JavaScript/jQuery 脚本不起作用？