程序员最近都爱上了这个网站  程序员们快来瞅瞅吧!  it98k网:it98k.com

本站消息

站长简介/公众号

  出租广告位,需要合作请联系站长


+关注
已关注

分类  

暂无分类

标签  

暂无标签

日期归档  

暂无数据

如何仅禁用特定类下的单击按钮

发布于2022-09-28 09:49     阅读(530)     评论(0)     点赞(28)     收藏(1)


我有一个包含 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>

解决方案


这是提交表单的FIDDLE作品。

<form>
  <button id="id1" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id2" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id3" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id4" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id5" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id6" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id7" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id8" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id9" type="submit" name="submit" class="btn-primary">Submit</button>
</form>
<form>
  <button id="id10" type="submit" name="submit" class="btn-primary">Submit</button>
</form>


$('form').submit(function() {
  $(this).find('.btn-primary').prop("disabled", "disabled");
});

PS 你在 ResourceID 上有重复的 ID!




所属网站分类: 技术文章 > 问答

作者:黑洞官方问答小能手

链接:http://www.qianduanheidong.com/blog/article/428939/842ef19f1b12f04cbbc9/

来源:前端黑洞网

任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任

28 0
收藏该文
已收藏

评论内容:(最多支持255个字符)