Question

我想用无线电选项更改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>

Answer 1

脚本标签无法自行关闭，而solidus需要一个关闭标记：

<script src="./js/bootstrap.min.js"></script>

要改变css，这应该有效：

$('.radio-inline').click(function() {
  $('#estilos').attr('href', $(this).val());
});

JQuery脚本改变href无法正常工作

1 个答案: