仅当单击其他按钮时,才使按钮处于非活动状态

Make button inactive only when clicked on other button

本文关键字:按钮 于非 活动状态 单击 其他      更新时间:2023-09-26

我有以下情况:

我有一个"下一步"步骤按钮:

<a href="/NL/checkout/selectshippingaddress?addressId=" class="customNextStep">
    <input type="button" class="button-1 shipping-adress-next-step-button" value="Next" name="nextstep">
</a>

此按钮首先应处于非活动状态。仅当用户单击其他按钮时,它才应可单击:

<input type="button" onclick="" class="button-1 select-shipping-address-button" data-itemid="197" value="Send to this address">

我希望有人可以帮助我解决这个问题。

您可以使用

jQuery 的attr()removeAttr()

$("input[name='nextstep']").attr('disabled','disabled');
$('.button-1').on('click',function(e){
   e.preventDefault();
   $("input[name='nextstep']").removeAttr('disabled');
});

小提琴示例

代码中使用以下内容:

    <input type="button" id="bt1" value="button 1" />
    <input type="button" id="bt2" value="button 2" disabled="disabled" />

现在应用您想要的任何逻辑,例如

$(function(){
    $("#bt1").click(function(){
        $(this).attr("disabled", "disabled");
        $("#bt2").removeAttr("disabled");
    });

利用按钮的disabled属性。喜欢

<input type="button" onclick="document.getElementById('next_button').disabled=false;" class="button-1 select-shipping-address-button" data-itemid="197" value="Send to this address">
<input type="button" class="button-1 shipping-adress-next-step-button" value="Next" name="nextstep" disabled='true' id='next_button'>

在这里工作小提琴

使用以下:

jQuery('input[name=nextstep]').attr('disabled','disabled')
$('.select-shipping-address-button').on('click',function(e){
    jQuery('input[name=nextstep]').removeAttr('disabled')
})

这是工作演示

您可以使用disabled属性来打开和关闭按钮。

//on document.ready, disable your second button
$(selector).prop("disabled", true);
// on the click on first button enable it again
$(selector_first_button).click(function() {
    $(selector).prop("disabled", false);
});