Question

我正在处理一个表单，该表单需要在选择特定选项时禁用某些选项。我是jquery的初学者，需要帮助。感谢。

这是链接

我需要做的是，当我们从表单的第一行中选择第一个选项时，我们需要禁用第二行选项中的一些选项。

这是我的HTML。请帮我解决Jquery

HTML

<form id="calx">

    <div class="container">



        <div class="span10">


        <div class="row-fluid service">
        <h3>step 1: Select Your Service*</h3>
        <input id="proc1" type="radio" name="proc" value="100"><label for="proc1"><img src="img/simply.png" width="120"><br></label>
        <input id="proc2" type="radio" name="proc" value="150"><label for="proc2"><img src="img/pristine.png"  width="120"><br></label>
        <input id="proc3" type="radio" name="proc" value=""><label for="proc3"><img src="img/custom.png"  width="120"><br></label>


        </div>


        <div class=" row-fluid beds">
            <h3>numbers of bedrooms</h3>
            <input id="beds1" type="radio" name="beds" value="10"><label for="beds1"><img src="img/1.png"><br><small>one bedroom apt</small></label>
            <input id="beds2" type="radio" name="beds" value="20"><label for="beds2"><img src="img/2.png"><br><small>two bedroom apt</small></label>
            <input id="beds3" type="radio" name="beds" value="30"><label for="beds3"><img src="img/3.png"><br><small>three bedroom house</small></label>
            <input id="beds4" type="radio" name="beds" value="40"><label for="beds4"><img src="img/4.png"><br><small>four bedroom house</small></label>
            <input id="beds5" type="radio" name="beds" value="50"><label for="beds5"><img src="img/5.png"><br><small>five bedroom house</small></label>
        </div>


                <input type="submit" value="BOOK YOUR APPOINTMENT" class="btn btn-primary btn-large bttm" />


        </div>
    </div>
</table>
</form>

这是我到目前为止所尝试的内容

$(document).ready(function() { 
    $(".service").children('input').hide(); 
    $(".service").change(function() {
        $(".beds").children('input').hide(); 
        $(".beds").children("input[value^=" + $(this).val() + "]").show() 
    }) 

})

Answer 1

这样的事情应该让你开始。

var checkedId = $('form input[type=radio]:checked').attr('id'); //get the id of the checked radio button in the first set
if(checkId = 'proc1'){
    $('#beds1').prop('disabled', true); //disable radio button in the second set
}

Answer 2

你在这里

$('input[name=proc]').click(function(){
    $('input[name=beds]').prop('disabled', false);
    if($(this).is('#proc1')){
        $('#beds1, #beds3').prop('disabled', true); //Disablin beds1 and beds3
    } else if ($(this).is('#proc2')) {
        //disable other buttons for proc2
    } else {
        //disable other buttons for proc3
    }

});

希望有所帮助

需要一个jquery解决方案。如何在选择一个项目时禁用某些项目

2 个答案: