javascript - 当用户单击按钮时无法禁用该按钮

Question

我添加了以下 jquery 来禁用所有具有名为 .disableButton 的类的按钮，如下所示:-

$('.disableButton').on('click', function (e) {
    $(this).prop('disabled', true);
});//disable further clicks

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="submit" value="Submit" class="disableButton btn btn-primary" />
<input type="text" class="disableButton" name="NPI" placeholder="" style="height: 50px;" />

但是当我点击它们时，按钮不会被禁用..

Answer 1

您做得很好，但使用 this 时犯的一个小错误this 只会影响该特定元素，而不是所有元素

尝试这个而不是这个

        $('.disableButton').prop('disabled', true); 

    $('.disableButton').on('click', function (e) {
    		alert('disabling buttons, now after this buttons will not work'); 
        $('.disableButton').prop('disabled', true);
    });//disable further clicks

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

    <input type="submit" value="Submit" class="disableButton btn btn-primary" />
    
    <input type="submit" value="Submit 2" class="disableButton btn btn-primary" />
    
    <input type="submit" value="Submit 3" class="disableButton btn btn-primary" />
    
    <input type="text" class="disableButton" name="NPI" placeholder="" style="height: 50px;" />