jQuery：IF條件的多個單選按鈕字段？

https://jsfiddle.net/fbzf10x6/6/jQuery：IF條件的多個單選按鈕字段？

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

這是一個簡化版本。最後我會有很多領域和更多的選擇。

感謝您的幫助！

來源

2016-07-27 MrSocrathes

爲了使您的案例能夠使用以下代碼片段，您應該採用「圖片名稱必須與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>

來源

2016-07-27 14:11:33

jQuery：IF條件的多個單選按鈕字段？

回答

相關問題