1

这是我的 html 代码

<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”时显示“10x10 = 100”、“10x20 = 200”、“20x10 = 200”等(任何合适的)(即 rdNumber radio) 匹配值.. 直到现在它工作正常

  1. 现在我尝试在选择“其他”收音机时添加禁用和重新启用“从下面的图像中选择”收音机的功能。我成功禁用了.. 即,当我选择“其他”收音机时,它正在禁用“从下面的图像中选择”收音机,但在选择 300、200 或 100 时,它不会再次启用它..在这种情况下需要帮助..

  2. 还有如何做到这一点,当用户选择“其他”时,它会禁用“从下面的图像中选择”,当用户选择 100、200、300 收音机时,它会启用“从下面的图像中选择”,但它应该自动选择“从图像中选择”下方”单选按钮,该按钮应显示上述 1 中的隐藏 div。即,如果用户选择 100,它将自动选择“从下面的图像中选择”并应显示适用的 div 即“10x10 = 100”,这是我无法完成的..但是对手动用户选择“上传您的自己的图像”收音机或“从下面的图像中选择”

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

4

1 回答 1

1

有几个问题立即突出。首先,您缺少});java 脚本底部的 (在页面顶部打开)。

其次,变量“rdNumberPages”从未在任何地方声明,这使得某些代码无法工作。

我对代码做了一些小的改动,你可以在这里看到

于 2013-03-07T06:51:07.300 回答