Question

我制作了一个包含多个复选框和收音机表单的菜单。当访问者选择他的选择时，我需要一个脚本来显示他选择的选项。只有一个选项可供选择，有500多种选择。我可以使用复选框的结果来使用java更改图像的来源吗？ structure RadioForm1：大小

小中（选中）大

Radioform2：颜色：蓝色绿色红色黄色（已选中）橙

的src：图像/介质/黄/ img.png

Answer 1

JSFIDDLE

<html><head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
$( document ).ready( function() {
    var colors = $( '.color' ),
        sizes  = $( '.size' ),
        img    = $( '#image' ),
        changeHandler = function( evt ){
            var path = [ 'Images', sizes.filter(':checked').val(), colors.filter(':checked').val(), 'img.png' ].join('/');
            img.attr( 'src', path );
//            img.attr( 'alt', path );
            console.log( path );
        };
    colors.on( 'change', changeHandler );
    sizes .on( 'change', changeHandler )
          .change();
} );
</script>
</head>
<body>
  <fieldset>
    <legend>Color</legend>
    <div>
        <input class="color" name="color" value="Red" id="color_red" checked="checked" type="radio">
        <label for="color_red">Red</label>
    </div>
    <div>
        <input class="color" name="color" value="Yellow" id="color_yellow" type="radio">
        <label for="color_yellow">Yellow</label>
    </div>
    <div>
        <input class="color" name="color" value="Blue" id="color_blue" type="radio">
        <label for="color_blue">Blue</label>
    </div>
</fieldset>
<fieldset>
    <legend>Size</legend>
    <div>
        <input class="size" name="size" value="Small" id="size_small" checked="checked" type="radio">
        <label for="size_small">Small</label>
    </div>
    <div>
        <input class="size" name="size" value="Medium" id="size_medium" type="radio">
        <label for="size_medium">Medium</label>
    </div>
    <div>
        <input class="size" name="size" value="Large" id="size_large" type="radio">
        <label for="size_large">Large</label>
    </div>
</fieldset>
<img id="image" src="Images/Small/Red/img.png" height="100px" width="100px">
</body></html>

如何通过复选框的结果更改图片的来源

1 个答案: