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

【问题标题】：jQuery: IF conditions for multiple radio button fields?jQuery：多个单选按钮字段的 IF 条件？
【发布时间】：2016-12-01 13:53:59
【问题描述】：

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 等等。

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

感谢您的帮助！

【问题讨论】：

标签： jquery if-statement button conditional-statements radio

【解决方案1】：

您应该选择“图像名称必须像 black_round.jpg、black_triangle.jpg、white_round.jpg、white_triangle.jpg”才能使以下 sn-p 在您的情况下工作。

请查看下面的 sn-p 以获得更多理解。您应该必须通过检查元素检查图像 src，因为当前不会加载任何图像，因此我们目前没有这些图像。但是您可以重命名服务器上的图像名称并检查此代码。

$(document).ready(function() {
	var imgname = [];
  $("input[name=colour]").click(function() {
  		imgname['colour'] = $(this).val();
      if(Object.keys(imgname).length == 2){
        $("#image").attr('src',imgname['colour'] +'_'+ imgname['form']+'.jpg');
      }
  });
  
  $("input[name=form]").click(function() {
  		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>

【讨论】：