文章/答案/技术大牛

发布

社区首页 >问答首页 >如何通过JQuery查找和禁用按钮

问如何通过JQuery查找和禁用按钮
EN

Stack Overflow用户

提问于 2019-12-19 09:17:33

回答 2查看 155关注 0票数 2

我在html中有一个输入文本绑定和一个查找按钮。出于某些原因，我想禁用按钮和文本框。

我尝试了以下方法，但没有成功。

var btn = $("#x_Id_armaster").closest(".ew-lookup-list").find(".ew-lookup-btn");
console.log(btn.length)
btn.attr("disabled");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row col-md-12 col-lg-12">
  <label class="col-md-3 col-lg-3 captionstyle">
        Client <i data-phrase="FieldRequiredIndicator" class="fas fa-asterisk ew-required" data-caption="FieldRequiredIndicator"></i>
    </label>
  <div class="col-md-9 col-lg-9">
    <span id="el_s_invoice_Id_armaster">
            <span></span>
    <div class="input-group ew-lookup-list">
      <div class="form-control ew-lookup-text" tabindex="-1" id="lu_x_Id_armaster">
        Please select
      </div>
      <div class="input-group-append">
        <button type="button" title="" class="ew-lookup-btn btn btn-default" onclick="ew.modalLookupShow({lnk:this,el:'x_Id_armaster',m:0,n:10});" ata-original-title="Lookup - Client"><i class="fas fa-search ew-icon"></i></button>
      </div>
    </div>
    <input type="hidden" data-table="s_invoice" data-field="x_Id_armaster" data-multiple="0" data-lookup="1" data-value-separator=", " name="x_Id_armaster" id="x_Id_armaster" value="" onchange="ew.updateOptions.call(this);">
    </span>
  </div>
</div>

jquery

find

closest

回答 2

Stack Overflow用户

回答已采纳

发布于 2019-12-19 09:44:10

closest正在DOM树中遍历它的祖先，所以这就是代码失败的原因。

您可以使用closest和row类找到按钮。它们是相同的层次结构，closest工作过。

var btn = $("#x_Id_armaster").closest(".row").find(".ew-lookup-btn");
console.log(btn.length)
btn.prop("disabled", true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<div class="row col-md-12 col-lg-12">
  <label class="col-md-3 col-lg-3 captionstyle">
              Client <i data-phrase="FieldRequiredIndicator" class="fas fa-asterisk ew-required" data-caption="FieldRequiredIndicator"></i>
       </label>
  <div class="col-md-9 col-lg-9">

    <span id="el_s_invoice_Id_armaster">
            <span></span>
    <div class="input-group ew-lookup-list">
      <div class="form-control ew-lookup-text" tabindex="-1" id="lu_x_Id_armaster">Please select</div>
      <div class="input-group-append">
        <button type="button" title="" class="ew-lookup-btn btn btn-default" onclick="ew.modalLookupShow({lnk:this,el:'x_Id_armaster',m:0,n:10});" ata-original-title="Lookup - Client"><i class="fas fa-search ew-icon"></i></button>
      </div>
    </div>

    <input type="hidden" data-table="s_invoice" data-field="x_Id_armaster" data-multiple="0" data-lookup="1" data-value-separator=", " name="x_Id_armaster" id="x_Id_armaster" value="" onchange="ew.updateOptions.call(this);">
    </span>
  </div>
</div>

票数 2

Stack Overflow用户

发布于 2019-12-19 09:22:38

你可以这样做：

$('#x_Id_armaster .ew-lookup-btn').attr("disabled", true);

解释：

考虑到您的标记，$("#x_Id_armaster").closest(".ew-lookup-list").find(".ew-lookup-btn");是非常沉重和错误的。只使用'#x_Id_armaster .ew-lookup-btn'作为选择器将更快、更容易产生粉刺。

attr方法需要第二个参数，例如。

.attr("disabled", true)

下面是如何在不使用jQuery的情况下做到这一点：

 document.querySelector('#x_Id_armaster .ew-lookup-list').disabled = true;

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/59406519

复制

相似问题

问如何通过JQuery查找和禁用按钮
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何通过JQuery查找和禁用按钮EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何通过JQuery查找和禁用按钮
EN