2013-03-07 44 views
1

這是我的HTML代碼組合不workins如預期

<div class="wrapper"> <strong> Number of images:</strong> 
<div class="formText"> 
    <input type="radio" name="rdNumber" value="100" />100 
    <input type="radio" name="rdNumber" value="200" />200 
    <input type="radio" name="rdNumber" value="300" />300 
    <input type="radio" name="rdNumber" value="other" />other 
</div> 
</div> 

<div class="wrapper"> <strong><span>*</span> Image to be displayed:</strong> 
       <div class="formText"> 
       <input type="radio" name="rdImage" value="uploadImage" /> Upload your own image 
       <input style="margin-left:10px;" type="file" name="user_upload_image" class="uploader" id="file"> 
       <br /> 
       <input type="radio" name="rdImage" value="preExisting"/> Choose from images below 
       <div class="100 imgDisp"> 
        <div class="heading"> 
         10x10 = 100 
        </div> 
        </div> 

        <div class="200 imgDisp"> 
        <div class="heading"> 
         10x20 = 200 
        </div> 
        </div> 

        <div class="200 imgDisp"> 
        <div class="heading"> 
         20x10 = 200 
        </div> 
        </div> 

        <div class="300 imgDisp"> 
        <div class="heading"> 
         10x30 = 300 
        </div> 
        </div> 

        <div class="300 imgDisp"> 
        <div class="heading"> 
         30x10 = 300 
        </div> 
        </div> 

這是jQuery代碼

$(document).ready(function() { 
$("div.imgDisp").hide(); 
$('.' + $(":radio:checked").val()).show(); 
    $('input[name="rdNumber"]:radio').click(function() { 
    $("div.imgDisp").fadeOut('slow'); 
    $('.' + $(this).val()).fadeIn('slow'); 
}); 
}); 

var rdImage = $('input:radio[name="rdImage"]'); 
var rdNumbers= $('input:radio[name="rdNumber"]'); 
rdNumbers.change(function(e){ 
var $target = $(e.target); 
if($target.is(':checked')){ 
    if($target.is('[value="other"]')){ 
     rdImage.not('[value="uploadImage"]').prop('disabled', true); 
     rdNumberPages.filter('[value="uploadImage"]').prop('checked', true); 
    } else { 
     rdNumberPages.not('[value="uploadImage"]').prop('disabled', false); 
    } 
} 
}); 

的jQuery代碼的目的是 1顯示「在選擇「100」,「200」,「300」(即rdNumber無線電)時,選擇「10x10 = 100」,「10x20 = 200」,「20x10 = 200」等等。它工作正常

  1. 現在我試圖添加禁用和重新啓用「選擇下面的圖像」收音機選擇「其他」收音機功能。我取得了成功禁用..即當我選擇「其他」無線電它禁用「選擇下面的圖像」收音機,但選擇300,200或100它不能再次啓用它..在這種情況下需要幫助..

  2. 如何做到這一點,當用戶選擇「其他」它禁用「從下面的圖像選擇」,並當用戶選擇100,200,300電臺時,它使「從下面的圖像選擇」,但它應該自動選擇「從下面的圖像中選擇「單選按鈕,並按照上述1顯示隱藏的div。即如果用戶選擇100,它將自動選擇「從下面的圖像中選擇」,並應顯示適用的div,即我無法完成的「10x10 = 100」。但手動用戶選擇「上傳您的自己的形象」單選或‘選擇圖片下面的’

這裏是小提琴 http://jsfiddle.net/xeMjC/1/

回答

1

有一對夫婦的那站了出來,立竿見影的問題。首先,你錯過了java腳本底部的});(在頁面頂部打開)。其次,變量'rdNumberPages'永遠不會在任何地方聲明,這使得一些代碼無法工作。

我已經取得了一些小的改動的代碼,你可以看到here

+0

什麼生根粉點2號? – aks 2013-03-07 07:26:08

+0

你從我這裏得分... thanx夥計.. – aks 2013-03-07 07:47:10

+0

y是這些行重複? – aks 2013-03-07 09:04:41