我有一个包含 10 个带有 .btn-primary 类的输入按钮的表单,我编写了以下脚本以在单击按钮时禁用它:-
$('form').submit(function() {
$('input.btn-primary').prop("disabled", "disabled");
})
但我面临的问题是,当用户点击一个输入按钮时,所有其他 9 个输入按钮都会显示。那么有没有一种方法可以修改我当前的脚本,以便仅禁用已单击的输入按钮。我当前的方法将禁用 .btn-primary 类下的所有按钮? 谢谢
表单如下所示:-
<input type="submit" value="Add To TMS" class="btn btn-primary"/>
<img src="/Content/Ajax-loader-bar.gif" class="loadingimage" id="16202imag"/>
</form>
</td>
</tr>
<tr>
<td>
VMware Virtual Platform
</td>
<td>
none
</td>
<td>
see20
</td>
<td>
a
</td>
<td>
test site
</td>
<td>
VMware Virtual Platform
</td>
<td>
In Store
</td>
<td id = "18605">
<form action="/VirtualMachine/CreateOnTMS" data-ajax="true" data-ajax-loading="#18605imag" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#18605" id="form1" method="post"><input name="__RequestVerificationToken" type="hidden" value="eiSEILmh7BnQESGGGWhE534pbYX_ZYBQjrrETGZc-nTyNzS8fymRWifu7M8Q8qDHMZKmLXuKh64rP3lzigfPgwE4CckHO8bRA7FiPxVjh_jNSxF9rngl8HvOXEbzT7910" /> <span class="f"> Role</span>
<select class="SmallDropDown" data-val="true" data-val-number="The field Role must be a number." data-val-required="The Role field is required." id="VirtualMachine_RoleID" name="VirtualMachine.RoleID"><option value="">Choose...</option>
<option value="1">SQL Server</option>
<option value="2">Virtual Center</option>
<option value="3">ESX</option>
<option value="4">Web Server</option>
</select><span class="field-validation-valid" data-valmsg-for="VirtualMachine.RoleID" data-valmsg-replace="true"></span> <span class="f">Server</span>
<select class="SmallDropDown" data-val="true" data-val-number="The field Hypervisor Server Tag must be a number." data-val-required="The Hypervisor Server Tag field is required." id="VirtualMachine_ServerID" name="VirtualMachine.ServerID"><option value="">Choose...</option>
<option value="552">S122222244</option>
<option value="557">S122222246</option>
<option value="565">S122222247</option>
<option value="568">S122222248</option>
<option value="579">S122222250</option>
</select><span class="field-validation-valid" data-valmsg-for="VirtualMachine.ServerID" data-valmsg-replace="true"></span><input id="ResourceID" name="ResourceID" type="hidden" value="18605" /> <input type="submit" value="Add To TMS" class="btn btn-primary"/>
<img src="/Content/Ajax-loader-bar.gif" class="loadingimage" id="18605imag"/>
</form>
</td>
</tr>
<tr>
<td>
VMware Virtual Platform
</td>
<td>
none
</td>
<td>
see33
</td>
<td>
bb
</td>
<td>
testsitefrom it360
</td>
<td>
VMware Virtual Platform
</td>
<td>
In Store
</td>
<td id = "18610">
<form action="/VirtualMachine/CreateOnTMS" data-ajax="true" data-ajax-loading="#18610imag" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#18610" id="form2" method="post"><input name="__RequestVerificationToken" type="hidden" value="RyF2VRjwRlbWgRfqL377UJLaT8R1SANDhjeqwGy59_CX8HWmkzED91qIwip_rY4wdzKEelGlHTbe2mCa4bV0sT6juOn2yAm39Plto7JAygBPOrPS8ThECfFVYjhkuN9m0" /> <span class="f"> Role</span>
<select class="SmallDropDown" data-val="true" data-val-number="The field Role must be a number." data-val-required="The Role field is required." id="VirtualMachine_RoleID" name="VirtualMachine.RoleID"><option value="">Choose...</option>
<option value="1">SQL Server</option>
<option value="2">Virtual Center</option>
<option value="3">ESX</option>
<option value="4">Web Server</option>
</select><span class="field-validation-valid" data-valmsg-for="VirtualMachine.RoleID" data-valmsg-replace="true"></span> <span class="f">Server</span>
<select class="SmallDropDown" data-val="true" data-val-number="The field Hypervisor Server Tag must be a number." data-val-required="The Hypervisor Server Tag field is required." id="VirtualMachine_ServerID" name="VirtualMachine.ServerID"><option value="">Choose...</option>
<option value="552">S122222244</option>
<option value="557">S122222246</option>
<option value="565">S122222247</option>
<option value="568">S122222248</option>
<option value="579">S122222250</option>
</select><span class="field-validation-valid" data-valmsg-for="VirtualMachine.ServerID" data-valmsg-replace="true"></span><input id="ResourceID" name="ResourceID" type="hidden" value="18610" /> <input type="submit" value="Add To TMS" class="btn btn-primary"/>
<img src="/Content/Ajax-loader-bar.gif" class="loadingimage" id="18610imag"/>
</form>
最佳答案
这将导致它在点击时被禁用(直到页面重新加载,无论如何......)
$('button').on('click', function(e) {
$(this).prop('disabled', true);
});
关于javascript - 如何仅禁用被单击的按钮,该按钮位于特定类下,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20168102/