jQuery：IF条件的多个单选按钮字段？

Question

https://jsfiddle.net/fbzf10x6/6/

<form action=""> 
<input type="radio" name="colour" value="black"> black 
<br> 
<input type="radio" name="colour" value="white"> white 
<br> 

<br> 

<input type="radio" name="form" value="round"> round 
<br> 
<input type="radio" name="form" value="triangle"> triangle 
<br> 

有两种形式字段 “颜色” 和 “形式” 与确定要显示的图像的单选按钮。选择在小提琴中看到的颜色。

如果用户现在检查第二个字段（name =“forms”）中的三角形，我需要显示一个白色三角形。如果他在形式中检查“颜色”和“圆形”中的黑色，则应将img src更改为black_round.jpg等。

这是一个简化版本。最后我会有很多领域和更多的选择。

感谢您的帮助！

Answer 1

为了使您的案例能够使用以下代码片段，您应该采用“图片名称必须与black_round.jpg，black_triangle.jpg，white_round.jpg，white_triangle.jpg相似”。

请检查以下代码片段以获得更多理解。你应该检查检查元素的图像src，因为目前没有图像加载，因为我们目前没有这些图像。但是，您可以重命名服务器上的图像名称并检查此代码。

$(document).ready(function() { 
 
\t var imgname = []; 
 
    $("input[name=colour]").click(function() { 
 
    \t \t imgname['colour'] = $(this).val(); 
 
     if(Object.keys(imgname).length == 2){ 
 
     $("#image").attr('src',imgname['colour'] +'_'+ imgname['form']+'.jpg'); 
 
     } 
 
    }); 
 
    
 
    $("input[name=form]").click(function() { 
 
    \t \t imgname['form'] = $(this).val(); 
 
     if(Object.keys(imgname).length == 2){ 
 
     $("#image").attr('src',imgname['colour'] +'_'+ imgname['form']+'.jpg'); 
 
     } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action=""> 
 
    <input type="radio" name="colour" value="black"> black 
 
    <br> 
 
    <input type="radio" name="colour" value="white"> white 
 
    <br> 
 

 
    <br> 
 

 
    <input type="radio" name="form" value="round"> round 
 
    <br> 
 
    <input type="radio" name="form" value="triangle"> triangle 
 
    <br> 
 

 
    </form> 
 

 
    <div><img id="image" src="http://4.bp.blogspot.com/-MuBXtqpPw7s/T31fChtWOOI/AAAAAAAAAWI/QRpSQv__DcM/s320/black%2B9.png"></div>