Question

请帮助解决这种情况：如何在付款和交付类型之间建立关系（使用jquery）？例如，如果用户在付款中选择“预购”，则会自动选中“预订，交付不可用”。如果用户选择“PayPal”，他可以选择“邮件服务”和“ AIR MAIL ”，但“预购，交付不可用“是readonly。我感谢您的帮助。

<label>Payment type:</label>
<input type="radio" name="payment" value="10" class="payment-item" id="pay-type-10" onclick="shEvOrd('payment',this)"><label class="label" for="pay-type-10">Pre Order</label>
<input type="radio" name="payment" value="11" class="payment-item" id="pay-type-11" onclick="shEvOrd('payment',this)"><label class="label" for="pay-type-11">PayPal</label>
<br>
<label>Delivery type:</label>
<input type="radio" name="delivery" value="7" class="delivery-item" id="del-type-7" onclick="shEvOrd('delivery',this,1)"><label class="label" for="del-type-7">Pre Order, delivery not available</label>
<input type="radio" name="delivery" value="6" class="delivery-item" id="del-type-6" onclick="shEvOrd('delivery',this,1)"><label class="label" for="del-type-6">Mail Service</label>
<input type="radio" name="delivery" value="5" class="delivery-item" id="del-type-5" onclick="shEvOrd('delivery',this,1)"><label class="label" for="del-type-5">AIR MAIL</label>

<input type="button" value="Place order" id="order-button" onclick="shopCheckOut();this.order.reset">

Answer 1

你可以试试这个

// attach a click event to the payment radio group
$(".payment-item").click(function(){

    var payment = $("input:radio[name='payment']:checked").val(), // check the current value
        isPaypal = payment !== "10", // a simple check to see what was selected
        delivery = $("#del-type-7"); // get the radio element with the pre-order option           


    return delivery.prop({
        // Disabled if `isPaypal` is true
        disabled: isPaypal,
        // Checked if `isPaypal` is true
        checked: !isPaypal
    });      
});

查看演示http://jsfiddle.net/jasonnathan/3s3Nn/2/

Answer 2

<强> jsBin demo

所有你需要的：

var $delType7 = $("#del-type-7");       // Cache your elements
$("[name='payment']").click(function(){
    var PPal = $("[name='payment'][value='10']").is(':checked'); // Boolean
    $delType7.prop({checked:!PPal, disabled:PPal}); // boolean to toggle states
});

_从HTML

中删除onclick

http://api.jquery.com/checked-selector/
http://api.jquery.com/prop/

如何在单选按钮之间建立关系？

2 个答案: