Return 已选择的图片

Question

我有一个 HTML 代码。必须有 2 个问题，每个问题都建议 4 个图像答案。我怎样才能 return 在带有 javascript 的结果选择图像中？

<div class="quest">
        <div class="answer">
            <input type="radio"  value="car1"  class="inputimg"/>
            <label for="car1">
                <img src="spare.png">
            </label>
        </div>
        <div class="answer">
            <input type="radio"  value="car2"  class="inputimg" />
            <label for="car2">              
                <img src="spare.png">
            </label>
        </div>
        <div class="answer">
            <input type="radio"  value="car3"  class="inputimg" />
            <label for="car3">
                <img src="spare.png">
            </label>
        </div>
        <div class="answer">
            <input type="radio"  value="car4"  class="inputimg" />
            <label for="car4">
                <img src="spare.png">
            </label>
        </div>
    </div>

Answer 1

请尝试下面的代码，

当您点击图片时，它会提示相应单选按钮的值

/* using jquery*/

function test(dhis){
  var val=dhis.attr('src');
  $('#displayimg').append(' <img src="'+val+'">')
}

/* using javascript*/

function test1(dhis){
  var val=dhis.getAttribute('src');
  var div = document.getElementById('displayimg');
  div.innerHTML +=' <img src="'+val+'">'
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="quest">
            <div class="answer">
                <input type="radio"  value="car1"  class="inputimg" name="test" id="car1"/>
                <label for="car1" >
                    <img src="spare.png" onclick="test($(this));test1(this)">
                </label>
            </div>
            <div class="answer">
                <input type="radio"  name="test" value="car2"  class="inputimg" id="car2" />
                <label for="car2" >              
                    <img src="spare.png" onclick="test($(this));test1(this)">
                </label>
            </div>
            <div class="answer">
                <input type="radio" name="test" value="car3"  class="inputimg" id="car3"/>
                <label for="car3">
                    <img src="spare.png" onclick="test($(this));test1(this)">
                </label>
            </div>
            <div class="answer">
                <input type="radio" name="test"  value="car4"  class="inputimg"id="car4" />
                <label for="car4">
                    <img src="spare.png" onclick="test($(this));test1(this)">
                </label>
            </div>
        </div>
        
        <div id="displayimg">
        </div>

Return 已选择的图片

Return selected images

html

javascript

input

selection